إضافة زر Back top Button

بسم الله الرحمن الرحيم

 

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

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

أتركك مع الشرح فهو جد بسيط

 

توجه إلى لوحة التحكم / تخطيط / إضافة أداة / Html/JavaScript

 

  

بعد ذالك قم بنسخ الكود بالأسفل و ضعه في المربع المخصص للكود

<!--BACK2TOP-STARTS-->
<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img onmouseover="this.src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3VaNaOa44klIzTysg2ZxiKcQgO0B0EqMzpuUEwMu0Ue9H6kDjSeiPrm8YW04uIuM76VkG9vqLec3XZjgwvBYfY8DVaSHEP-eRVRB8EcwfBAFHA8u1d17JMNaarjYuFb6bLjNSLLrTdDg/s1600/up+b.png" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJwCMc8piy3Rzxbkx2_udAJ5Tve3ar11oMVhtRvD2dex94H72us5-7uqXdxa81IGnfSMWhvs2-rhoedjpkqHM_CWpvG4YOpLLaovxd99Mh1vkJ-oqVKLpUStyJJgL1SLnbMI3ntybWiMU/s1600/up+s.png" onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJwCMc8piy3Rzxbkx2_udAJ5Tve3ar11oMVhtRvD2dex94H72us5-7uqXdxa81IGnfSMWhvs2-rhoedjpkqHM_CWpvG4YOpLLaovxd99Mh1vkJ-oqVKLpUStyJJgL1SLnbMI3ntybWiMU/s1600/up+s.png'"/></a>
<!--BACK2TOP-STOPS—>

 

ثم قم بحفظ الأداة ستجد الإضافة على أسفل اليمين في المدونة.

 

يمكنك تغير الصورة بالصورة التي تريد ما عليك سوى تغير الرابط بالأحمر برابط الصورة الأكبر ثم تغير الرابطين باللون الأزرق بصورة الأصغر.

 

أتمنى أن تكون الإضافة نالت إعجابك.

إذا أعجبك الموضوع فشاركه مع أصدقائك فلن يأخد منك الأمر سوى 5 ثوان :)