Blog Back To Top Yukarı Çık Eklentisi Nasıl Eklenir

Blogger, Blogarınızda yazılarınız fazla ise okuyucularınızın bir tıklama ile sayfa başına gitmesine yardımcı olabilirsiniz. Sayfa yukarı ç...

...

Blogger, Blogarınızda yazılarınız fazla ise okuyucularınızın bir tıklama ile sayfa başına gitmesine yardımcı olabilirsiniz. Sayfa yukarı çık eklentisi “Back To Top” ismi ilede bilinen çok şık bir eklentidir. Sayfa yukarı çık eklentisini blog şablon kodları arasına eklemek için yapılacak işlemler inceleyelim. Not: Şablonunuzu yedeklemeyi mutlaka yapınız herhangi bir hatada şablonu geri yükleyebilirsiniz. Yedekleme ile ilgili açıklamaları buradan okuyabilirsiniz.
1. Blogger blogunuza giriş yapın. Sayfa sağ üst kısımdan şablon yedeğini alın.
2. Şablon ⇒ HTML’i düzenle tıklayın.
3. Widget şablonlarını genişlet tıklayın.
4. CTRL + F arama kutusunu açın ve kutuya aşağıdaki kodu yapıştırarak arattırın. Zaten kendi hemen bulacaktır. CANLI DEMO
Arama yapılacak kodumuz :

]]></b:skin> 

Bu alanda dikkat etmeniz gereken bir konu var.Şablonlarda bazen kodlar bitişik çıkabilir. Böyle bir konu ile karşılaşırsanız ; Sağda çift düz parantezin başına maus'unuzu tıklayın ve entere basın kod bir satır şağıya kayacak ve düzelecektir.

5. Bu işlemleri düzelttikten sonra aradığımız kod bulundu ise bunun hemen üstüne aşağıdaki kodu kopyalayıp yapıştırın. Kaydedin. Yaptığımız tüm işlemin sonunda kaydedin yazmamamın nedeni, uyguladığımız işlemde yaptığımız bir hata varsa şablon bizi uyaracaktır.Bu nedenle her işlemde kaydedin şeklinde belirtiyorum.

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

6. Şimdiye kadar hata almadığınızı kabul ederek devam ediyorum. şimdi aşağıdaki kodu 
arattırın ve bulun.

</body> 

7. Bulduğunuz kodun hemen üst kısmına aşağıda yapılandırılmış kodu kopyalayın ve yapıştırın. Kaydedin.Şablon hatası alırsanız, mutlaka tırnaklardan biri açık kalmıştır. Uyarı verir korkmayın. Farklı bir ülkeden bu işlemi yapıyorsanız, Google Translate dil çevirisi yaptığından kodların arası açık kalabilir.Tarayıcı üst kısımdan çeviriyi orjinaline ala tıklayarak, kodu tekrar alın ve yapıştırın. Düzelecektir.

<a href="#" id="backtotop"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYGoH3J3SGV7ig-NWAiIOWTwZY2xMxyv3MY32u-MxEVTTlCT594A-Ca8CAW9sOJivfsJ96ZKurQCjO3r3fPEJWfPlVNbwg9oPvKPArMad9cFCx3gjHW51JTSYBCzKrpThT7tkV8OzCA0g/s1600/sayfa+yukar%C4%B1.png" alt="back to top" /></a> 

8. Resim Url yazan kısma isterseniz kendi beğendiğiniz bir resmin URL’sini ekleyerek şablona uygulayabilirsiniz. Resim ekleme ana kalıbı aşağıda verilmiştir. Dilediğiniz resmin URL’sini kullanabilirsiniz.

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

9. Yukarıda hazır kod içinde verilen resmin URL’si aşağıda gördüğünüz resime aittir ve Picasa da barındırılmaktadır. Rahatlıkla kullanabilirsiniz.

Değişik resimleri incelemek için picasa a bakabilir URL’leri alıp kullanabilirsiniz.

Picasa giriş için tıklayın. Resimleri Slayt Olarak İzleyebilirsiniz.