Blog Yazılarının Altına Yazar Bilgi Kutusu Ekleyin

Yazar bilgi kutusu, her blog yazısının sonunda yer alan ve yazarla ilgi kısa bilgiler  ile iletişim bilgilerini içeren bir kutudur.

Blogger’da birden fazla yazarı olan bloglar için değil ama tek bir yazarı olan bloglar için bu yazar bilgi kutusunu kullanabiliyoruz.Nasıl mı?

1.Adım: Kumanda Paneli > Şablon > HTML’yi Düzenle  yolunu izleyerek Widget Şablonlarını Genişlet kutusunu işaretleyin ve Ctrl + F tuş kombnasyonunun yardımıyla ]]></b:skin> kodunu bulun.Bu kodun hemen üstüne şu kodları ekleyin:

.author_info {
float: right;
width: 450px;
padding: 10px;
border: 1px solid #e0e0e0;
margin-bottom: 15px;
margin-top: 15px;
background: #eee;
}
.author_info h3 {
margin-bottom: 10px;
}
.author_photo {
float: left;
margin: 0 0 0 10px;
}
.author_photo img {
margin-right: 10px;
border: 1px solid #e0e0e0;
}

2.Adım: Şimdi <data:post.body/> kodunu bulun ve bunun altına aşağıdaki kodları ekleyin:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='author_info'>
<div class='author_photo'>
<img alt='author'
src='http://i51.tinypic.com/r89tfm.png'/>
</div>
<h3>Yazar Hakkında</h3> Merhaba ben
<a href='http://bloghocam.blogspot.com/p/hakkmda.html'
target='_blank' title='Hakkımda'>Serdar Kara</a>.
Geçmişte blog yazarken edindiğim tecrübeleri acemi
blogcularla ve blogunu geliştirmek isteyenlerle paylaşmanın
keyifli olacağını düşünerek
<a href='http://bloghocam.blogspot.com/'
target='_blank' title='Blog Hocam'>Blog Hocam</a>
&#8217;ı yazmaya başladım.Yazılarımı sürekl okumak
isterseniz Blog Hocam&#8217;ı
<a href='http://www.facebook.com/pages/Blog-Hocam/196713297023764'
target='_blank' title='Facebook İleTakip Et'>Facebook</a>,
<a href='http://twitter.com/bloghocam' target='_blank'
title='Twitter İle Takip Et'>Twitter</a>,
<a href='http://feedburner.google.com/fb/a/mailverify?uri=BlogHocam'
target='_blank' title='E-Posta İle Takip Et'>E-Mail</a> veya
<a href='http://feeds.feedburner.com/BlogHocam'
target='_blank' title='RSS İle Takip Et'>RSS</a> ile
takip edebilirsiniz.

</div>
</b:if>

Düzenlemeniz Gereken Yerler

- Eğer yazar bilgi kutusu olması gerekenden büyük yada küçük ise 1.adımdaki kodlarda yazan width: 450 px yazan değeri değiştrin.

- 2.adımdaki kodlarda http://i51.tinypic.com/r89tfm.png yerine kendi resminizin U:RL’sini yazın.

- Yazar hakkında bana ait olan bilgileri kendinize göre değiştirin.