Hazır Temalar için Devamını Oku Özelliği

Daha önce sizlerle Blogger tarafından Devamını Oku Özelliğinin Artık Standart hale getirildiğinden bahsetmiştim. Bu özellik Blogger'ın temel temalarında kolaylıkla uygulanabilir. Ancak hazır temalarda kullanılabilmesi için temanızda bir kaç değişikliğin yapılması gerekmektedir.

Devamını Oku Özelliği (Hazır Tema / Düzenlenmiş Tema / Standart Olmayan Tema)

Hazır temanızda hale hazırda Devamını Oku özelliği varsa; iki yol izlenebilir.
Birincisi tema üzerinde herhangi bir değişiklik yapmadan Standart Devamını Oku özelliği anlatımındaki gibi istenen yere atlama aralığı eklenir. Çok uğraştırmayacak bu özellik ile yolunuza devam edebilirsiniz.

Ya da ikinci yol olarak öncelikle hazır temanızdaki Devamını oku özelliğini kaldırmalısınız.
(Uyarı: Temanızda herhangi bir değişiklik yapmadan önce lütfen temanızın yedeğinizi almayı unutmayın.)

Eğer herhangi bir Blogger Yardım blogu yardımı ile Devamını Oku Özelliğini temanıza eklediyseniz. Tavsiyem, yine o kaynağı baz alarak tersi işlemleri yapmanızdır. Şayet kullanmakta olduğunuz hazır temada varsıyalan bir özellik olarak devamını oku özelliği ekliyse, kaynak olarak şu siteleri kullanabilirsiniz: Devamını Oku (ing), Blogger'da "Devamını Oku" Bağlantısı Yapmak (tr)

Tabi böyle bir durum söz konusu ise ve yukarıdaki yolları izleyip temanızdan var olan devamını oku özelliğini kaldırırsanız, tüm geçmiş yazılarınızı tekrar düzenlemeniz gerekmektedir. Bu meşakatli bir yol gibi görünsede açıkçası tavsiye edilen esas yöntemdir.

Devamını oku özelliğini hazır temanızda yoksa ya da yukarıdaki anlatıma benzer yollarla temanızdan devamını oku özelliğin kaldırdıysanız, şu yolu izleyebilirsiniz.

Temanızda <data:post.body/> kodunu bulun. Bulmuş olduğunuz bu kodun hemen alt satırına alttaki kodu yapıştırın.

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >

Şablonu önizleme ile görüntüleyin. Eğer bir sorun ile karşılaşılmadıysa kaydedin. Hata veriyorsa işlemi tekrar deneyin.

Ardından Devamını Oku yazınızı kendinize özgü değiştirme işlemlerine girişebilirsiniz. Yukarıdaki eklemiş olduğumuz kodda da tanımladığımız gibi temamızda devamını oku özelliği jump-link olarak anılacak. Eğer CSS kodları ile eklemeler yaparsak yazıların altında yer alacak olan devamını oku yazısını farklılaştırabiliriz.

Örneklerle açıklamak daha faydalı olacaktır;
Temanızda yer alan ]]></b:skin> kodunun üst satırına alttaki kodu eklerseniz, devamını oku yazınızın rengini ve üzerine fare ile gelindiğinde altı çizili bir hale gelmesini sağlar.

.jump-link {color: #CCC;text-decoration: underline;}

Diğer örnekler de şöyle; Arkaplan, renk ve padding (itme) değerlerini düzenleyebilirsiniz.

.jump-link a {
background: #ffff00;
padding: 3px;
color: #fff;
}

Hover efekti eklemek isterseniz;

.jump-link a:hover {
background: #000000;
padding: 3px;
color: #ccc;
}

Farklı CSS kodaları da eklenebilir bu tamamen sizin tercihinizdedir.

Ekstra: Resimli Devamını Oku
Son olarak ekstra bir bilgi olarak devamını oku özelliğine nasıl resim ekleyebileceğinizide anlatmak isterim.

Yazılarınızın altında görüntülenecek devamını oku yazısının resimli olmasını tercih edecek kullanıcılar, temalarıa yukarıdaki anlatımla eklemiş oldukları kodda yer alan <data:post.jumpText/> kodunu alttaki kırmızı ile renklenrilmiş kod ile değiştirebilirler.

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'>
<img src="resim-url-adresi" border="0" alt="Bilgi" />
</a>
</div>
</b:if >

Kırmızı ile renklendirilmiş kodda resim-url-adresi yazan yere kullanılmak istenen resmin adresini yazmayı unutmayın.

Umarım kullanmakta olduğunuz hazır temalarınızda devamını oku özelliğini kullanabilmeniz için faydalı bir yazı olmuştur. Eğer yazıyı beğendiyseniz Sosyal Ağ Bağlantı Tuşları ile arkadaşlarınızı da bu yazıdan haberdar etmeyi unutmayın.

Kolay gelsin...

Kaynak; BB