1. Ana Sayfa
  2. Eklentiler

Blogger Yukarı Çık Butonu

Blogger Yukarı Çık Butonu
+ - 0
yukari-cik-butonu-ekleme
Blog okuyucularınızın sayfa yazılarında rahatca gezinmesi ve bir üst sayfalara rahatça ulaşabilmesi için blogunuza alt sayfadan üst sayfaya çıkmaya yarayan yukarı çıkma simgesi ekleyin. Blogger blogunuz için yukarı çıkma butonunu nasıl eklenecek aşağıda inceleyerek blogunuza uygulamaya başlayabilirsiniz.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 (üstü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.


http://3.bp.blogspot.com/_JwD5r652h00/SvDAnTlDfDI/AAAAAAAAAQY/y-NAytkDXjI/s1600/bttp-5.png

http://2.bp.blogspot.com/_JwD5r652h00/SvDAnGbH7qI/AAAAAAAAAQQ/qKtrVmPCBXY/s1600/bttp-4.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDAmyqvA9I/AAAAAAAAAQI/hACE99TswzU/s1600/bttp-3.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDAmXE1tvI/AAAAAAAAAP4/pQk69X73NIo/s1600/bttp-1.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDAmVOZPMI/AAAAAAAAAQA/_Y2Nd0UZVMM/s1600/bttp-2.png

http://4.bp.blogspot.com/_JwD5r652h00/SvDBBZGgr-I/AAAAAAAAAQg/1X96vgeWqaw/s400/bttp-6.png0/bttp-7.png

http://2.bp.blogspot.com/_JwD5r652h00/SvDBCN6PpfI/AAAAAAAAARA/oEpqkKnL0Jw/s400/bttp-10.png

http://2.bp.blogspot.com/_JwD5r652h00/SvDBBw_U6MI/AAAAAAAAAQ4/KDKaH8OTDO4/s400/bttp-9.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDBBzoz4II/AAAAAAAAAQw/n9hIomKpQxY/s400/bttp-8.png

http://3.bp.blogspot.com/_JwD5r652h00/SvDBBlYeFHI/AAAAAAAAAQo/lzY3WpZpwPA/s40

http://4.bp.blogspot.com/_JwD5r652h00/SvDBWWig4UI/AAAAAAAAARI/28cXbIDOaqk/s400/bttp-11.png

http://4.bp.blogspot.com/_JwD5r652h00/SvDBWmm_WTI/AAAAAAAAARQ/xfyALfcAbZ4/s400/bttp-12.png

http://3.bp.blogspot.com/_JwD5r652h00/SvDBW6QlhXI/AAAAAAAAARY/6ZxECjTlMxM/s400/bttp-13.png

http://3.bp.blogspot.com/_JwD5r652h00/SvDBW-al_pI/AAAAAAAAARg/Aoxlzmp3Kw0/s400/bttp-14.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDBXF2WGRI/AAAAAAAAARo/FIPZOwsTTBc/s400/bttp-15.png

http://3.bp.blogspot.com/_JwD5r652h00/SvDBloI2NZI/AAAAAAAAARw/VI-Li7cPUvM/s1600/bttp-16.png

http://1.bp.blogspot.com/_JwD5r652h00/SvDBl9PLQ7I/AAAAAAAAAR4/5fV05DNfZ9o/s400/bttp-17.png

http://3.bp.blogspot.com/_JwD5r652h00/SvDBl0UhsvI/AAAAAAAAASA/ge0GmH0HkyE/s400/bttp-19.png

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.

Bültenimize Katılın

Hemen ücretsiz üye olun ve yeni güncellemelerden haberdar olan ilk kişi olun.

Yazar Hakkında

Web site yazılım tasarım uygulama eklenti ve yenilikler hakkında güncel bilgi ve haber platformu. Samsun-Turkey - 1989-2005 Temsa Mitsubishi Sabancı Otomotiv grubunda çalıştı. Araştırma, Geliştirme, Web siteleri ile uğraşma ve Paylaşımı seven biriyim.

Yorum Yap