Blogger Yukarı Çık ve Aşağı İn Butonu

Merhaba arkadaşlar web sitelerin genelinde yukarı çık çapası vardır nadir olarak da bazı sitelerde hem yukarı çık çapası hemde aşağı in çapası vardır.Ben nadir olan eklentiyi bugün size sunacağım.
Bazı makalelerimde de anlamışsınızdır umarım aslında kodlar size tasarım ve görünüm yaratır bu yüzden de bütün kodlar aslında tasarım üzerinedir tamam bazıları bu kapsama girmez ama yine de bağlantısı vardır.Neyse direkt eklentimizin kurulumuna geçelim.

İlk olarak Blogger yönetim panelimize giriş yapıyoruz daha sonra CTRL+F yardımı ile </head> etiketini aratıyoruz ardından aşağıdaki kodu hemen üzerine ekliyoruz.

JS<script type='text/javascript'>
//<![CDATA[
//Gematriga
function loadCSS(e, t, n) { "use strict"; var i = window.document.createElement("link"); var o = t || window.document.getElementsByTagName("script")[0]; i.rel = "stylesheet"; i.href = e; i.media = "only x"; o.parentNode.insertBefore(i, o); setTimeout(function () { i.media = n || "all" }) }
loadCSS("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
//]]>
</script>

Aşağıdaki kodu da </head> kodunun altına ekliyoruz.

HTML<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'/>

JS<script type='text/javascript'>
//<![CDATA[
//Gematriga
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>