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

الدرس46شرح طريقة تثبيت قائمة الاقسام العلوية

العلوي او اي اضافة فى القائمة الجانبية لبلوجر بدون ان يختفي عند النزول الى اسفل المدونة
how to fix and make sticky widget in blogger

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

طبعا الطريقة سهلة جدا فقط عليك باضافة كود CSS  واخر  JAVA SCRIPT  و القيام ببعض التعديلات

1 - قم بالبحث عن الوسم  : ثم اضف فوقه هذا الك

/*------ CSS make sticky widget blogger by:www.arabes1.com ------*/ .sticky {position:fixed; top:10px;/* distance from the top*/ z-index: 100;}

2 - قم بالنزول الى اسفل صفحة تحرر قالب مدونتك تجد وسم  اضف فوقه هذا السكريبت

<script type='text/javascript'> /* script make sticky widget blogger by:www.arabes1.com */ $(document).ready(function() { var stickyWidgetTop = $('add id or class').offset().top; var stickyWidget = function(){ var scrollTop = $(window).scrollTop(); if (scrollTop > stickyWidgetTop) { $('add id or class').addClass('sticky'); } else { $('add id or class').removeClass('sticky'); } }; stickyWidget(); $(window).scroll(function() { stickyWidget(); }); }); </script>

لاتنسى تغيير add id or class باسم ID او CLASS الخاص بالعنصر الذي تريد تثبيثه

شاهد الفيديو التعليمي

تصنيف : دروس بلوجر