إضافة صندوق إعجاب فيسبوك عائم لمدونة البلوغر اوموقعك الالكتروني بشكل جداب وجميل | دورة بلوجر


دورة بلوجر |إضافة صندوق إعجاب فيسبوك عائم لمدونة البلوغر اوموقعك الالكتروني بشكل جداب وجميل



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

تطوّرت مواقع التدوين بعد ذلك لتصبح مليئة بالميّزات المختلفة، وانتقلت من مواقع يتم فيها التفاعل من طرف واحد فقط إلى مواقع يتم فيها التفاعل بين طرفين؛ وذلك عن طريق تمكين الزائر من كتابة التعليقات ونشر الوصلات على منشورات موقع التدوين؛ وذلك بدوره يُعزِّز من الحِوارات والنقاشات التي تتم في المواقع
سابقاً تطرقنا في أحد الحلقات دورة بلوجر التي قمنا ببنائها على مدونتنا والتي يمكنك الرجوع إليها من مقالة دورة بلوجر ومراجعتها.
 اضافة تعريف الكاتب في بلوجر هى اضافة هامة جدا بالنسبة للمدونات وخاصة المدونات الجماعية التى تحتوى على اكثر من كاتب حيث تعطى هذة الاضافة معلومات عن الكاتب about Author تتميز اضافة تعريف الكاتب بتنسيق جميل وشكلها الانسيابى بالاضافة انها تضيف لمسة من الجمال على المدونة بشكلها الانيق 

مما يزيد من جمال المدونة اضافة تعريف كاتب الموضوع اسفل تدوينه بلوجر اصبحت اضافة مهمة لتعريف الزائر عليك وعلى مدونتك وذالك من خلال وضع المعلومات الخاصة بك والتى مكونة من صورة للكاتب ونبذة مختصرة عنة وعن مدونتة بالاضافة الي أزرار اشهر المواقع الإجتماعية مثل فيس بوك  Facebook  تويتر Twitter  جوجل بلس  Google plus يوتيوب  Youtube وقد تم الحرص على أن تكون بها لمسة من الجمال وتأثير رائع .

1 - شرح طريقة اضافة وتركيب تعريف الكاتب بشكل احترافي لمدونات بلوجر

1- اولا توجة الى لوحة التحكم قالب تحرير HTML

2- تاني قم بأخد نسخة أحتياطية تجنب وقوع أي مشكل لقالب أو المدونة 
3- قم بتوسيع عناصر الستايل بالضغط على السهم الخاص بذلك
4- أبحث عن الوسم ]]></b:skin>
ثم  أضف الكود التالي فوقة

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
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;
}
#fanclose {
float:right;
cursor:pointer;
background:url(http://3.bp.blogspot.com/-NRmqfyLwBHY/T4nwHOrPSzI/AAAAAAAAAdQ/8b9O7O1q3c8/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-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'){
$('#fanback').delay(100).fadeIn('medium');
$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>

<div id='fanback'><div id='fan-exit'></div><div id='fanbox'><div id='fanclose'></div><div class='remove-borda'></div>

<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/chrohat1&width=402&height=255&colorscheme=light&show_faces=true&border_color=%23E2E2E2&stream=false&header=false'


style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe>

</div></div>

3- بعد إضافة الكود أعلاه، قم بتغيير www.facebook.com/chrohat1 بعنوان صفحة الفيس بوك الخاصة بك، ثم إحفظ الأداة.

هذا كل شيء، لقد قمت لتوك بتركيب الأداة.


الآن أصبح بإمكانك أنت و زوارك رؤية صندوق الفيس بوك هذا على مدونتك لمرة واحدة فقط و لن يظهر الصندوق للزائر إلا إذا قام بمسح كوكيز المتصفح الخاص به. و ذلك (كما قلت سابقا) لكي لا تزعج زوار موقعك بانبثاق الصندوق عدة مرات أثناء تصفحهم لمدونتك..

للمزيد من التوضيح كما عودناكم على مدونة شروحات للمعلوميات شروحات دائما مرفوقة بالدرس فرجة ممتعة



- يمكنك مشاهدة : دورة بلوجر

أضف تعليق

أحدث أقدم

Comments

no-style