Blogger Şablonunu Düzenleme
1-) Site Genişlik Ayarlarını Değiştirmek
Blogger şablonumuzu istediğimiz gibi şekillendirmek istiyorsak onun dilinden iyi anlamalıyız. Onu anlamak için de hangi dilden konuştuğunu; yani hangi değişkenler ile iletişime geçtiğini çok iyi bilmeliyiz.
Blogger şablonlarının iskeleti şu 4 ana öge üzerine kuruludur:
- Header
- Main
- Sidebar
- Footer
Bu 4 ögeyi de sarıp sarmalayan en dıştaki öge ise genellikle Content Wrapper yada Outer-Wrapper ismini alır.
Şimdi yazı alanımızın genişliğini değiştirmek istediğimizi düşünelim. Yazı alanının bulunduğu yer main etiketi ile tanımlanmış olduğundan CSS kodları arasında ilgili tanımlamayı bulalım.
Burada gördüğünüz gibi benim blogumda yuvarlak köşeler oluşturabilmek adına main-wrap1 ve main-wrap2 şeklinde iki tanımlama yapıldı. Yuvarlak köşeler oluşturmanın detayı girmeyeceğim zira bunu eburhan'ın blogunda anlatmıştım. Şimdi adım adım ilerleyelim:
- İlk olarak yazı alanını 100px genişleteceğinizi düşünelim. Yazı alanını yani main .Blog ögesininin genişliğini 100px arttırın.
- Yazı alanıyla birlikte Sayfa Ögelerinin yani widget'lerin de boyutunu 100 px arttırmalıyız. Böylece yazı altına bir Sayfa Ögesi koyduğunuzda eşit genişlikte olacaktır. Bunun için main . widget ögesinin genişliğini de 100px arttırın.
- Son olarak main-wrap1 ve en dıştaki ögeyi yani Outer-Wrapper ögesini de 100 px genişletmeliyiz. Böylece içinde oluşan genişliğe ayak uydurabilsin ;)
İşlem adımlarını daha iyi anlayabilmek için yukarıdaki Blogger şablonunu temsil eden resme bakmanız yeterli ;)
Gördüğünüz gibi, yapmak istediğiniz değişikliğin nereleri etkilediğini bilirseniz işiniz kolaylaşıyor. Blog şablonunuzun iskeletini anladığınızda geriye çok birşey kalmıyor.
2-) Bağlantıları (linkler) Yeni Bir Sayfada Açma
Bu işi yapmak çocuk oyuncağı olsa da şablonunu tanımayan insanlar için en zor işlerden biri halini alabiliyor. Zira sıradan bir bağlantıya target="_blank" satırını eklemek kolay olsa da blog üzerinde bulunan herhangi bir kalıcı bağlantı için bu satırı nereye ekleyeceğini bilmeyen kullanıcıların sayısı bir hayli fazla.
Şimdi blog yazarlarının sıkça kullandığı Bağlantı Listesi (Blogroll) içindeki bağlantıların yeni bir sayfada nasıl açılacağını öğrenelim.
Eğer Blogger'ın sunduğu Sayfa Ögesi olan Bağlantı Listesi ile bir liste oluşturduysanız şablon kodlarınız arasında "Linklist" şeklinde aratmanız işinizi kolaylaştıracaktır. Doğru bir arama ile aşağıdakine benzer bir kod satırı bulmalısınız.
Altını kırmızı ile çizdiğim kısmı ekleyerek Blog Listesi içinde bulunan tüm bağlantıların yeni bir sayfada açılmasını sağlayabilir, bunun gibi diğer ögeler için de aynısını yapabilirsiniz.
3-) Devamını Oku Bağlantısını Özelleştirme
Blogger üzerinde yayın yapan bir çok blog Blogger'da "Devamını Oku" Bağlantısı Yapmak yazısı ile bloglarına "devamını oku" bağlantısı eklediler. Daha sonra benim blogumda görmeleri üzerine bazı kimseler devamını oku bağlantısını nasıl özelleştirebileceğini sordu.
<b:if cond='data:blog.pageType != "item"'><br/>
<a class='fullpost-link' expr:href='data:post.url'>Yazının devamını okuyun...>></a>
</b:if>Yukarıda gördüğünüz gibi orjinal kodda bulunan a etiketine bir sınıf atadım ve bunu CSS'te tanımladım. CSS'te tanımlama yaparken Main ögesinin tanımlamasını dikkate alarak aşağıdakine benzer bir tanımlama yapmalısınız:
#main-wrap1 a.fullpost-link {
background-color:#??????;
color:#??????;}
#main-wrap1 a.fullpost-link:hover {
background-color:#??????;
color:#??????;}CSS tanımlaması yaparken bir çok farklı kombinasyon yapmak mümkün. Örneğin siz devamını oku kodunu bir div etiketi içine alıp, CSS'te buna bir id atarsanız CSS kodunuzu da buna göre yazarsınız. Ama bir a etiketini özelleştirirken sınıf atamak daha doğrudur.
Bitirirken...
Gördüğünüz gibi anlattığım hiç bir şey Blogger'a özgü değil. Önemli olan şablonunuzu tanımak. Bu yazı ile aklınızdaki soru işaretlerini azaltmakla birlikte yenilerinin de eklendiğinden şüphem yok. Ancak kendi başınıza uğraşıp, öğrenmek en iyisi.
