Blogger İpuçları Serisi ile devam ediyoruz arkadaşlar.Bugün Bilgicelli arkadaşımın isteği üzerine Kod Çerçevesinin nasıl yapıldığını anlatacağım.Bu eklenti sayesinde kodları daha düzgün bir şekilde okuyucularımıza göstermiş olacağız.Hazırsak hemen anlatıma geçelim:
Her zamanki gibi Blogger hesabımıza girip "Yerleşim/HTML'yi Düzenle" sekmesine gelip "Widget Şablonlarını Genişlet" tikini aktif hale getirdikten sonra ]]> kodundan önce şu kodları yapıştıralım:
/***************** Çerçeve Kodu Bölümü *******************/
.post-body pre {
background: transparent url(http://i49.tinypic.com/29w4d8g.png) no-repeat scroll 2px 0px;
padding-left: 2px;
padding-top: 26px;}
.post-body pre code {
background-color: #fff8af;
display: block;
width: 540px;
overflow: auto;
padding: 0 1em;
color: #555555;
border-left: 4px solid #EB1885;}
kodları yapıştırdıktan sonra şablonu kaydedelim.İşin basit tarafı bitti.Bu bölümde biz sadece "css" tanımlamasını yaptık.Şimdi de bu tanımlamaları özelleştirelim:
Kodda yeşil ile gösterdiğim resim linkini kendinize ait olarak değiştirebilirsiniz.Yalnız bunun için o linkteki resim boyutlarıyla aynı olacak şekilde yeni bir resim yapabilirsiniz.Diyelim resmi o boyutlarda yaptınız ve o resimdeki gibi pembe renk değilde siz reminizi mavi olarak ayarladınız.Bu şekilde yaptığınızda "EB1885" renk kodunuda yaptığınız resmin arkaplan kodu ile aynı olacak şekilde ayarlamalısınız.Biraz karışık gibi oldu ama inanın çok basit.
Bu aşamadan sonra sıra geldi yazılarınızda bu kodu kullanmaya.Bu kodu göstermek için siz yazınızın içinde şu kodu kullanacaksınız:
Yazılarınızı Bu Alana Yazacaksınız.
Bu gösterdiğim kısım çok önemli.Genel itibari ile yapması basit bir eklenti eğer yine de yapamadığınız yer olursa sormaktan çekinmeyin ;)
Bu eklentilerin devamı gelecek inşallah.Hergün bir eklenti yazmam şu anda imkansız gibi görünüyor.Hergün yazamadığım için haliyle ne zaman yazacağım belli olmuyor.Bu yüzden Feedburner aboneliğini kullanarak takip ederseniz yazım size an itibariyle olmasada ulaşacaktır :)