Sitene Yukarı Çık Butonu Ekleme ( Blogger Yukarı Çık Butonu Yapımı )



Bazı sitelerin tema tasarımlarında olmasa da  genellikle çoğu web sitesinde halihazırda yukarı çık butonu var.

Bu yukarı çık butonundan memnun olan da var olmayan da... Bu nedenle memnun olmayan kitle ile hiç buton olmayan siteler alternatif buton eklentileri için arayışa girer.

Bizlerde bu yazımızda sizler için özellikle  WP ve Blogger altyapısını kullanan kullanıcıların işine yarayacak  yukarı çık buton kodundan bahsedeceğiz.

Bu eklentimiz birçok tarayıcı ile uyumlu olarak çalışmaktadır. Bu nedenle kafanızda soru işareti kalmasın. 

Blogger kullanıcıları için ;

Blogger Ana Paneline Giriş > Sol Menüde Yer Alan Tema Sekmesine Giriş Yaptıktan Sonra> Tema HTML Düzenle yolunu takip ederek tema HTML kısmında CTRL+F yardımıyla
</body>  kodunu buluyorsunuz.

Bu kodu bulduktan sonra aşağıdaki HTML kodunu bu kodun bir üst satırına ekleyiniz. Bu iş bu kadar.


<style>
#onlyJSyc{
display: none;
position: fixed;
bottom: 20px;
right: 20px;
z-index: 9999;
border: none;
outline: none;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGleQBbvKotcyn8BAhczX0SaGp6lAUPR1UibPTzYZNv14PXXJQ5GYdo71ktZPcgxwUIx33ql1bA4_xzBwIq3_4A7ThMZAhK2HjekIYCAX6DlW0m7yvcA4ZoTFly8i96hXkm1qDLD9BQcpZ/s1600/yukari.png) no-repeat;
cursor: pointer;
padding: 0px;
width: 40px;
height: 40px;
}
</style>
<button onclick="topFunction()" id="onlyJSyc"></button>
<script>
window.onscroll = function() {
scrollFunction()
};
function scrollFunction() {
if (document.body.scrollTop > 500 || document.documentElement.scrollTop > 500)
document.getElementById("onlyJSyc").style.display = "block"
else
document.getElementById("onlyJSyc").style.display = "none"
}
function topFunction() {
if (document.body.scrollTop > 0 || document.documentElement.scrollTop > 0) {
document.body.scrollTop -= 40
document.documentElement.scrollTop -= 40
setTimeout(function() {
topFunction()
}, 0)
} else {
document.body.scrollTop = 0
document.documentElement.scrollTop = 0
}
}
</script>





Not: Genellikle denemediğimiz veya kırık linkleri takipçi ve izleyicilerimizle paylaşmıyoruz.

Yukarı Çık Butonu Görüntüsü




Previous
Next Post »