الدرس 63: كود لعمل مؤثرات جميلة على الصور و اضافة صندوق الاعجاب فايسبوك مثبت على بلوجر


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

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

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

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

- كيفية اضافة كود تاثير على الصور فى مدونة بلوجر

ابحث عن الوسم :  ]]></b:skin> و اضف فوقة كود CSS التاالي :
.separator {overflow:hidden;}
.post-body img {background:transparent;box-shadow:none;-webkit-backface-visibility:hidden;transition:all 2s}
.post-body img:hover {opacity:initial;-webkit-filter:invert(100%);}

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

ابحث عن الوسم :  </head>   و اضف تحته الكود التالي
- لاتنسى تغيير اسم صفحة الفيسبوك : infoarabe باسم رابط صفحتك
ملاحظة مهمة : قم بتحويل السكريبت الاخير الذي يبدا بـ : 
<iframe src="http://www.facebook.com/plugins/likebox.php?     الى   </a></span> 
 بعد تغيير اسم صفحتك الفيسبوك عبر  محول الاكواد من هذا الموقع : code-converter  قم بادخال السكريبت و اضغط على convert  ثم اعد نسخ الكود الذي تم تحويله و ضعه فى القالب

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

جميع الحقوق محفوضة لدى مدونة علوم و تقنيات | Privacy-Policy | سياسة الخصوصية | اتفاقية الاستخدام

تعديل : Abderhim