شرح اضافة زر الصعود الى اعلى الصفحة في مدونات بلوجر

مرحبا لكل متابعي مدونة PH3ahmed

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

طريقة اضافة الزر

1.اذهب الى لوحة التحكم في مدونتك اختر القالب

2.تحرير html

3.قم بالبحث عن الرمز </body> ثم اضف الكود التالي فوق الرمز بودي

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

<style type="text/css">
#w2b-StoTop {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>
<script type='text/javascript'>
$(function() {
$.fn.scrollToTop = function() {
$(this).hide().removeAttr("href");
if ($(window).scrollTop() != "0") {
$(this).fadeIn("slow")
}
var scrollDiv = $(this);
$(window).scroll(function() {
if ($(window).scrollTop() == "0") {
$(scrollDiv).fadeOut("slow")
} else {
$(scrollDiv).fadeIn("slow")
}
});
$(this).click(function() {
$("html, body").animate({
scrollTop: 0
}, "slow")
})
}
});
$(function() {
$("#w2b-StoTop").scrollToTop();
});
</script>
<a href='#' id='w2b-StoTop' style='display:none;'>إلى أعلى الصفحة </a>

ملاحظة هامة إذا كان متوفر احد اصدارات ajax الكود باللون الاحمر لا تقم بإضافته مرة أخرى من أجل تجنب الاخطاء وعادةً يكون موجود فوق الرمز </head>

فقط ابحث عن هذه الكلمة ajax  اذا كانت متوفرة لا حاجة لإضافة

واختر الحفظ ومبروك عليك

هل أعجبك الموضوع ؟

Share

Tweet