الخميس، 31 ديسمبر 2015

إضافة زر الصعود إلى أعلى لمدونات بلوجر

إضافة زر الصعود إلى أعلى لمدونات بلوجر

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

* ملاحظة إذا كنت تتوفر على زر الصعود فلابد من حذفه أولا



شرح طريقة تركيب الإضافة


1. توجه لقالب >> تحرير 

2. ابحث بإستعمال Ctrl+F عن <head/>

3. ضع الكود التالي فوقه

* الكود هو فقط لإظهار الأيقونة إذا كنت تتوفر عليه فلا داعي لإضافته

<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>




4. ابحث عن ]]></b:skin 

5.  ضع الكود التالي فوقه 
.smoothscroll-top {
position:fixed;
opacity:0;
visibility:hidden;
overflow:hidden;
text-align:center;
z-index:99;
background-color:#2ba6e1;
color:#fff;
width:47px;
height:44px;
line-height:44px;
right:25px;
bottom:-25px;
padding-top:2px;
border-radius:5px;
transition:all 0.5s ease-in-out;
transition-delay:0.2s;
}
.smoothscroll-top:hover {
background-color:#3eb2ea;
color:#fff;
transition:all 0.2s ease-in-out;
transition-delay:0s;
}
.smoothscroll-top.show {
visibility:visible;
cursor:pointer;
opacity:1;
bottom:25px;
}
.smoothscroll-top i.fa {
line-height:inherit;
}




ليست هناك تعليقات:

إرسال تعليق