كيف حالك يا اصدقاء ؟ في هذه المقالة سأقدم طريقه اضافه زر الصعود للاعلي في مدونات بلوجر .
كيفية اضافه زر العودة إلى الأعلى في مدونتك |
ما هي وظيفة زر الرجوع إلى الأعلى في مدونات بلوجر ؟
يتم تركيب زر الصعود الي الاعلي في المدونات لتسهيل عودة الزوار إلى القمة (اعلي الصفحه) على الفور وعمليًا دون الحاجة إلى التمرير مرة أخرى.
كيفية تثبيت زر العودة إلى الأعلى في مدونات بلوجر
عليك باذهاب الي صفحه تحرير القالب
أولاً ، افتح Blogger > ثم التصميم >ثم زر تحرير Html > أضف هذا الرمز قبل </ head>
<style> /* Back To Top */ .backtotop{display:none;background:#3c6382;color:#fff;font-size:1.4em;width:40px;height:40px;line-height:40px;outline:0;z-index:999;bottom:20px;right:20px;position:fixed;border-radius:5px;padding:0;text-align:center;cursor:pointer;opacity:1;transition:all .25s}.backtotop svg{width:24px;height:24px;transform:rotate(90deg);vertical-align:middle;transition:all .25s}.backtotop:hover{background:#0a3d62} </style>
ثم أضف الكود أدناه قبل </body>
<div class='backtotop hide'><svg viewBox='0 0 24 24'> <path d='M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z' fill='#fff'/> </svg></div> <script> //<![CDATA[ $(function(){$(window).scroll(function(){$(this).scrollTop()>100?$(".backtotop").fadeIn():$(".backtotop").fadeOut()}),$(".backtotop").click(function(){return $("html,body").animate({scrollTop:0},400),!1})}); //]]> </script>
ثم قم بحفظ القالب ثم شاهد النتائج.
وسعدنا بزيارتكم في مدونه بتاع بلوجر
تعليقات
إرسال تعليق
مدونه بتاع بلوجر ترحب بتعليقاتم