Blogger Yukarı Çık Butonu


+ - 2

back to top For Blogger

 

Blogger Yukarı Çık Butonu Nasıl Eklenir
Bu yazımda size farklı bir anlatım olan, blogumda alt kısımda görmüş olduğunuz yukarı çık butonunu anlatacağım. Öncelikle blogger kontrol panelinizden 
Tasarım> şablonlar>  html düzenleye gidiyoruz.
Aşağıdaki kodu aratıp buluyoruz. 

]]></b:skin>
Bu kodun üstüne şu kodu yapıştırıyoruz. 

 #backtotop {
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
}

 

Ardından şu kodu buluyoruz. 

</body>

 

Bu kodunda önüne şu kodu yapıştırıyoruz.

<a href="#" id="backtotop"><img src="resim-Url" alt="back to top" /></a>

 

Üstte gördüğünüz ‘Resim-Url‘ yazan yere aşağıda örnek resimlerden birinin adresini alıp yapıştırmanız yeterli olacaktır.

back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDAnTlDfDI/AAAAAAAAAQY/y-NAytkDXjI/s1600/bttp-5.png
back to top For Blogger
http://2.bp.blogspot.com/_JwD5r652h00/SvDAnGbH7qI/AAAAAAAAAQQ/qKtrVmPCBXY/s1600/bttp-4.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDAmyqvA9I/AAAAAAAAAQI/hACE99TswzU/s1600/bttp-3.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDAmXE1tvI/AAAAAAAAAP4/pQk69X73NIo/s1600/bttp-1.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDAmVOZPMI/AAAAAAAAAQA/_Y2Nd0UZVMM/s1600/bttp-2.png
back to top For Blogger
http://4.bp.blogspot.com/_JwD5r652h00/SvDBBZGgr-I/AAAAAAAAAQg/1X96vgeWqaw/s400/bttp-6.png0/bttp-7.png
back to top For Blogger
http://2.bp.blogspot.com/_JwD5r652h00/SvDBCN6PpfI/AAAAAAAAARA/oEpqkKnL0Jw/s400/bttp-10.png
back to top For Blogger
http://2.bp.blogspot.com/_JwD5r652h00/SvDBBw_U6MI/AAAAAAAAAQ4/KDKaH8OTDO4/s400/bttp-9.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDBBzoz4II/AAAAAAAAAQw/n9hIomKpQxY/s400/bttp-8.png
back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDBBlYeFHI/AAAAAAAAAQo/lzY3WpZpwPA/s40
back to top For Blogger
http://4.bp.blogspot.com/_JwD5r652h00/SvDBWWig4UI/AAAAAAAAARI/28cXbIDOaqk/s400/bttp-11.png
back to top For Blogger
http://4.bp.blogspot.com/_JwD5r652h00/SvDBWmm_WTI/AAAAAAAAARQ/xfyALfcAbZ4/s400/bttp-12.png
back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDBW6QlhXI/AAAAAAAAARY/6ZxECjTlMxM/s400/bttp-13.png
back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDBW-al_pI/AAAAAAAAARg/Aoxlzmp3Kw0/s400/bttp-14.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDBXF2WGRI/AAAAAAAAARo/FIPZOwsTTBc/s400/bttp-15.png
back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDBloI2NZI/AAAAAAAAARw/VI-Li7cPUvM/s1600/bttp-16.png
back to top For Blogger
http://1.bp.blogspot.com/_JwD5r652h00/SvDBl9PLQ7I/AAAAAAAAAR4/5fV05DNfZ9o/s400/bttp-17.png
back to top For Blogger
http://3.bp.blogspot.com/_JwD5r652h00/SvDBl0UhsvI/AAAAAAAAASA/ge0GmH0HkyE/s400/bttp-19.png
back to top For Blogger
http://2.bp.blogspot.com/_JwD5r652h00/SvDBmIGbP3I/AAAAAAAAASI/cL5okLpz_C8/s400/20.png

 

Yani kodları ekledikten sonra en son şekli şu şekilde olacaktır. 

 

<a href="#" id="backtotop"><img src="http://2.bp.blogspot.com/_JwD5r652h00/SvDBmIGbP3I/AAAAAAAAASI/cL5okLpz_C8/s400/20.png" alt="back to top" /></a>

 

Veya sadece yukarı çık yazmasını isterseniz eğer
 

<a href="#" id="backtotop">Back to top</a>

 

şeklinde de kullanabilirsiniz.

Yazar Hakkında

1959 yılında Samsunda doğdu. 1989-2005 Yılları arasında Temsa, Mitsubishi, Sabancı Holding grubunda Otomotiv, Bilgi işlem ve Yazılım bölümlerinde Müdür olarak çalıştı. Adnan Güney, şu anda, Network Dizayn Yazılım ve Tasarım koordinatörü olarak çalışmalarına devam etmekte. Ayrıca Blogger, Wordpress, Tumblr, Google sites gibi alanlara ilgili olup, uzun yıllardır SEO ve Alexa üzerinde çalışmakta.

Yorum Yap

Yorumlar (2)

  1. hiç bir işe yaramadı

Bir cevap yazın

E-posta hesabınız yayımlanmayacak.