إضافة وتركيب زر الصعود والنزول لمدونات بلوجر
مرحبا بكم في تدوتة جديدة حول اضافات بلوجر حيث سنتعرف على طريقة اضافت و تركيب زر الصعود و نزويل اعلى و اسفل لمدونات بلوجر، قمت مسبقا بشرح طريقة اضافة زر الصعود للاعلى على مدونة المحترف العربي ، لكن اليوم ساقدم لك عزيز المدون طريقة اضافة اثين معا و بتنسيق جميل و جداب يعطي لمدونة الخاص بك سهولة التصفح بين المواضيع.
ابحث عن </head> و اضف الكود التالي فوقه :
ثم قم بحفض القالب. وهنيئا لك لاتنسى انضام الينا حتا تصلك كل الاضافات بلوجر الحصرية وشكرا.
طريقة اضافت و تركيب زر صعود و نزويل الى مدونات بلوجر :
- قم بالتوجه الى مدونة بلوجر.
- اختر القالب ثم احتفض بنسخ احتياطية لتفادي اخطاء.
- ثم تحرير HTML.
- ابحث عن ]]></b:skin> و اضف الكود التالي فوقه :
/* Go Up and Down */ #scrollToTop{display:none;list-style:none;position:fixed;bottom:49%;right:10px;cursor:pointer;-webkit-transform:translateZ(0);transform:translateZ(0);z-index:99} #scrollToTop a{color:rgba(0,0,0,0.2);font-size:16px} #scrollToTop a:hover{color:rgba(0,0,0,0.5)} #top{position:absolute;top:0}
ابحث عن </head> و اضف الكود التالي فوقه :
<ul id='scrollToTop'> <li><a href='#top'><i class='fa fa-chevron-up' title='Go up'/></a></li> <li><a href='#bottom'><i class='fa fa-chevron-down' title='Go down'/></a></li> </ul> <div id='top'/> <div id='bottom'/> <script type='text/javascript'> //<![CDATA[ jQuery(document).ready(function(){var o=220,r=600;jQuery(window).scroll(function(){jQuery(this).scrollTop() > o?jQuery("#scrollToTop").fadeIn(r):jQuery("#scrollToTop").fadeOut(r)})}); $(function(){$("a[href*=#]:not([href=#])").click(function(){if(location.pathname.replace(/^\//,"")==this.pathname.replace(/^\//,"")&&location.hostname==this.hostname){var t=$(this.hash);if(t=t.length?t:$("[name="+this.hash.slice(1)+"]"),t.length)return $("html,body").animate({scrollTop:t.offset().top},600),!1}})}); //]]> </script>
ثم قم بحفض القالب. وهنيئا لك لاتنسى انضام الينا حتا تصلك كل الاضافات بلوجر الحصرية وشكرا.