0 Yukarı Çık Butonu Eklemek

Öncelikle blogger kontrol panelinizden tasarım>şablon>HTML’yi düzenle seçiyoruz.
Aşağıdaki kodu (Ctrl+F) aratıp buluyoruz. “Şablon yedek almayı unutmayın”
[HTML]]=]=></b:skin>[/HTML]

Bu kodun üstüne şu kodu yapıştırıyoruz.
[HTML] #backtotop {

padding:5px;

position:fixed;

bottom:10px;right:10px;

cursor:pointer;

}[/HTML]

Ardından şu kodu buluyoruz.
[HTML]</body>[/HTML]


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

[HTML]<a href=”#” id=”backtotop”><img src=”Resim-Adresi” alt=”back to top” /></a>[/HTML]


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


Resim 1
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnSGsQB-ax2qV-ipkznnwwqZvKYeyuGJGu6LEYVhrpcsezmNNIIDwBB9CzUTX4PhaaKwFeK7YIaS_IqEip0nrd1N9Bbolmi3ZClsYV6ZW5PhF-Z1nrA9maT-b0RIHLLrsy2ruvJaf78wIa/s400/bttp-13.png[/IMG]


Resim 2
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJS_DWLb7w2aVO9umBJvnKjnP2gBcCs7AdQ8VmqEnGDk3TqN_qcXl20zi7pm5Be_zrn4udobeX6iHrEed3zFyzNqLx10Zc5p2iRNt_LjCZGDGg8QGjQvAKF8Sm6eSJBL5_VCJx9bIvBz3S/s400/bttp-14.png[/IMG]

Resim 3
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYikgA8B9tDuNdhHndHBZl6V-3oaxxL7DXa_itD2i5TJmuaSsQ-L7-JtftkHGxLk847fcA98SCoGCGDzyxOR4wulny8iWdu44YWOWEXoPbq-rH7EAAFryl5mas0OVtvO3YWi3sIWnp68kp/s400/bttp-15.png[/IMG]


Resim 4
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcp1EagSLba8lXxQMAc4bVguZSQl0zL_o_PnosMQDQfdhwRNhdLVwQtsWCgytyN_TVE_nErlspEdxMfixgmlp7vOxgDc2h_yRAjGGE7cxrFhue_wSuSVQcL6ZkIg8Zd7Ru1JLjsy11iHQ_/s1600/bttp-16.png[/IMG]


Resim 5
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG6MRej08uggCKRObT-8Fros7E2rXbkKAJhjTMdpcbf102oDBAyMiOl6Pz8U0kF1VamYaENihb6BzIxGKy7pxif8vrZAjDy5hTxEZD0F6RdI3Yd_3-NuxtKgpQmqKo2RBiRybEaCJv5-0R/s400/bttp-17.png[/IMG]


Resim 6
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjowe8QCg4TyTK7jydt6uwbgE9MWa0Z6z2ASv0fsD194PC2dTiSTUH4KQF2l0jhlct0H-jkVFKoMRHRYcn0x8LekWfJOdWXob1kcFp8ikt1rmYV5ILleXOAL7dJXT_hLttVU8LD7dgqgFMp/s400/bttp-19.png[/IMG]


Resim 7
[IMG]https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjli2rD2FZb4U8yyojqBkF14ZnkmgJjIxCa-DbtsJZxp-_IfdgMFnHOYKZfH8k6XamGexyPuIbWSsyB8NIHcUDIADle4kAOqgv-6CrtEvSC1eTieHw_aPs9zBYna-bhOFQQN2H_krGRernz/s400/20.png[/IMG]


Yani kodları ekledikten sonra en son şekli şu şekilde olacaktır.
[HTML]<a href=”#” id=”backtotop”><img src=”https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjli2rD2FZb4U8yyojqBkF14ZnkmgJjIxCa-DbtsJZxp-_IfdgMFnHOYKZfH8k6XamGexyPuIbWSsyB8NIHcUDIADle4kAOqgv-6CrtEvSC1eTieHw_aPs9zBYna-bhOFQQN2H_krGRernz/s400/20.png” alt=”back to top” /></a>[/HTML]


Veya sadece yukarı çık yazmasını isterseniz eğer
[HTML]<a href=”#” id=”backtotop”>Yukarı Çık!</a>[/HTML]
şeklinde de kullanabilirsiniz.
Şablonumuzu kaydediyoruz.
İpucu: Herhangi bir hatayla karşılaşırsanız HTML yazan kısımda şablonu varsayalına döndür kısmınıda kullanarak şablonunuzu geri alabilirsiniz.