Blogger Sidebar Mavi Sekmeli Gadget Eklentisi

Blogger’un ana sayfasında en çok kullanılan eklentilerinizden olan gadgetlerinizi CSS kodları yardımı ile, özel tasarlanmış temalardaki gibi mavi renk’e dönüştürüp sabit sekme başlığı gibi kullanabiliriz. Blog yazılarımda daha önce de belirtiğim gibi blogger’un bizlere sunduğu hazır kendi şablonları ile Tema tasarımının nasıl yapılacağını açıklamış, ayrıca menü başlık kısmına Temalar ve Tema tasarım ismi ile kategori oluşturmuştum. Blogger’un kendi şablonunu kullanmak isteyen yazar arkadaşlar bu başlık ismine tıklayarak yapmak istedikleri uygulama için yardım alabilirler.

Tema tasarımı ile ilgili konularda anlaşılmayan yerleri yorumlar bölümünden belirtebilirsiniz. Bugün blog gadget başlık sekmesini mavi renkli nasıl yapacağız ve hangi CSS kodlarını kullanacağız aşağıda adım adım inceleyelim.

1. Blog’unuzu her ihtimale karşı yedeğini alın.

2. Blog kodlarımızın bulunduğu Şablon→ Html’yi düzenle’i açın.

3. Ctrl+F arama özelliği ile aşağıdaki kodu bulun.

]]></b:skin>

4. Yukarıda bulduğunuz kodun hemen üstüne aşağıdaki kodları ekleyin.

/* Sidebar Content----------------------------------------------- */
.sidebar{margin:0 0 10px 0;font-size:13px;color:#000000;}
.sidebar a{text-decoration:none;color:#000000;}
.sidebar a:hover{text-decoration:none;color:#4FC4F6;}
.sidebar h2, h3.widgettitle{background:url(http://2.bp.blogspot.com/-8D0oz2SFFpc/U2-bd4VQ6kI/AAAAAAAAZMU/Y6U8_P-cfCo/s1600/witget+mavi.png) left top repeat-x;border-bottom:2px solid #4FC4F6;color:#FFF;font-size:16px;line-height:16px;font-family:Oswald, sans-serif;font-weight:normal;text-decoration:none;text-transform:none;margin:0 0 10px;padding:10px 10px 9px;}
.sidebar ul{list-style-type:none;list-style:none;margin:0px;padding:0px;}
.sidebar ul li{background:url(https://lh6.googleusercontent.com/-Y5fzV3U_DNU/UImeh5JJUqI/AAAAAAAAKtU/lQ0f0w1caKw/s10/yol.gif) left 3px no-repeat;margin:0 0 8px;padding:0 0 9px 12px;}
.sidebar .widget{margin:0 0 15px 0;padding:0;color:#000000;font-size:13px;}
.main .widget{margin:0 0 5px;padding:0 0 2px}
.main .Blog{border-bottom-width:0}
.widget-container{list-style-type:none;list-style:none;margin:0 0 15px 0;padding:0;color:#000000;font-size:13px}

Özelleştirme :

1. Yukarıda 4. .sidebar h2 yazan yan kısımda bulunan linkimiz sekme başlık rengini değiştirir.

2. Yukarıda 6. .sidebar ul li yazan yan kısımda bulunan linkimiz sidebar sol tarafa küçük bir ok işareti ekler. Bu ok linkini değiştirip istediğinizi kullanabilirsiniz. 1. madde 4. .sidebar h2 kısmındaki linki değiştirseniz eklentiniz çalışmaz.

3. Sidebar da görülene ok işaretini istemiyor iseniz, bağlantı linkini silebilirsiniz.(Parantezler dahil silinecek. “()”) Ok işaretini halen görülüyor ise CRTL+Üstkarakter+R klavye tuşlarına basarak ön belleği yenilediğinizde ok işaratleri görülmeyecektir.

4. Bağlantıda mevcut olan ok işareti mavi renkli bir gif resmidir.Beğeneceğinizi umarım.

Post Views: 442