الجمعة، 26 مايو، 2017

اضافة صفحة اعجاب فيس بوك على شكل نافذه منبثقه داخل مدونة بلوجر

فى احدى الدروس السابقة من قسم دروس بلوجر وضعت لكم اضافة صندوق الأعجاب على المدونة بصفحتك من الفيس بوك LIKE BOX FACEBOOK والاضافة تعمل بدون مشاكل .

اليوم سأضع لكم اضافة اخرى بنفس الطريقة لكنها ليست ثابتة مثل الاضافة السابقة بل ستكون على شكل نافذة منبثقه تظهر للزائر مباشرة قبل الدخول الى صفحة مدونتك .

ميزة هذه الاضافة بأنها تظهر مرة واحدة فقط للزائر اثناء الدخول الى المدونة حتى لا تزعجة ويمل من المدونة .



تركيب اضافة نافذه منبثقه لتسجيل الاعجاب على الفيس بوك

 اذهب لوحة التحكم ثم الى التخطيط وقم بأضافة اداء جديدة واختار HTML/Java Script
ضع هذا الكود بداخلة :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js' type='text/javascript'></script>
<style>
    #hbfanback {
        display: none;
        background: rgba(0, 0, 0, 0.8);
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99999;
    }
    #hbfan-exit {
        width: 100%;
        height: 100%;
    }
    #hbfanbox {
        background: white;
        width: 420px;
        height: 270px;
        position: absolute;
        top: 58%;
        left: 63%;
        margin: -220px 0 0 -375px;
        -webkit-box-shadow: inset 0 0 50px 0 #939393;
        -moz-box-shadow: inset 0 0 50px 0 #939393;
        box-shadow: inset 0 0 50px 0 #939393;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        margin: -220px 0 0 -375px;
    }
    #hbfanclose {
        float: right;
        cursor: pointer;
        background: url(http://1.bp.blogspot.com/-FNtcBhH50iA/VKGx_CODj0I/AAAAAAAAD5w/rbd0OLy5lDs/s1600/hb-fanclose.png) repeat;
        height: 15px;
        padding: 20px;
        position: relative;
        padding-right: 40px;
        margin-top: -20px;
        margin-right: -22px;
    }
    .hbremove-borda {
        height: 1px;
        width: 366px;
        margin: 0 auto;
        background: #F3F3F3;
        margin-top: 16px;
        position: relative;
        margin-left: 20px;
    }
</style>
<script type='text/javascript'>
    //<![CDATA[ 
    jQuery.cookie = function(key, value, options) {
        // key and at least value given, set cookie... 
        if (arguments.length > 1 && String(value) !== "[object Object]") {
            options = jQuery.extend({}, options);
            if (value === null || value === undefined) {
                options.expires = -1;
            }
            if (typeof options.expires === 'number') {
                var days = options.expires,
                    t = options.expires = new Date();
                t.setDate(t.getDate() + days);
            }
            value = String(value);
            return (document.cookie = [
                encodeURIComponent(key), '=',
                options.raw ? value : encodeURIComponent(value),
                options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE 
                options.path ? '; path=' + options.path : '',
                options.domain ? '; domain=' + options.domain : '',
                options.secure ? '; secure' : ''
            ].join(''));
        }
        // key and possibly options given, get cookie... 
        options = value || {};
        var result, decode = options.raw ? function(s) {
            return s;
        } : decodeURIComponent;
        return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
    };
    //]]>
</script>
<script type='text/javascript'>
    jQuery(document).ready(function($) {
        if ($.cookie('popup_user_login') != 'yes') {
            $('#hbfanback').delay(100).fadeIn('medium');
            $('#hbfanclose, #hbfan-exit').click(function() {
                $('#hbfanback').stop().fadeOut('medium');
            });
        }
        $.cookie('popup_user_login', 'yes', {
            path: '/',
            expires: 7
        });
    });
</script>
<div id='hbfanback'>
    <div id='hbfan-exit'></div>
    <div id='hbfanbox'>
        <div id='hbfanclose'></div>
        <div class='hbremove-borda'></div>
        <iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fblog.kingnt&amp;width=340&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:340px; height:258px;margin-left: 8%;" allowtransparency="true"></iframe>
    </div>
</div>

قبل الحفظ قم بوضع اسم مستخدم صفحتك بدلا من صفحة كينج نت المحدد باللون الاحمر
مثال لمن لا يعرف اسم مستخدم الصفحة :
هذا الرابط التالى خاص بصفحة مدونة كينج نت 
كما تلاحظون اسم مستخدم الصفحة المحدد باللون الاحمر بعد علامة سلاش /
بالأخير اضغط على حفظ 

اتمنى بأن اضافة صفحة اعجاب فيس بوك على شكل نافذه منبثقه داخل مدونة بلوجر اعجبتكم 
(( لا خير فى كاتم العلم ))

هناك تعليق واحد :

قال تعالى ( مَا يَلْفِظُ مِن قَوْلٍ إِلا لَدَيْهِ رَقِيبٌ عَتِيدٌ )

الموافقة على نشر التعليقات

موقع كينج نت يسمح لك بإضافة رابط موقعك عبر التعليقات ولكن فى اطار مضمون المشاركات وان يكون صلة مباشرة بالمقال حتى يتم الموافقة على نشر التعليقات ولمن يضع روابط عشوائية بدون اضافة تعليق ليس له اى صلة بمحتوى الموضوع سيتم نقلة الى الرسائل الغير مرغوب فيها حتى تتم عملية الحذف .