17 Haziran 2009

Blog yazarına ait yorumların diğer ziyaretçilerin yorumlarından farklı görünmesini sağlayabilirsiniz.

Birçok blogger kullanıcısının hoşuna gideceğini düşündüğüm bu özellik ile yorumlarınızın rengini, arka planını değiştirebilme imkanınız var.

Bu anlatım bloggerin kullanıcılarına hazır şablonları baz alınarak anlatılmıştır. Eğer farklı bir şablon kullanıyorsanız. Aratmanız gereken kodların benzerlerini bulmaya gayret edin.

Adım 1: Blogger hesabınız ile giriş yapın.
Adım 2: Yerleşim > HTML'yi Düzenle'ye tıklayın ve şablonunuzun yedeğini mutlaka alın.
Adım 3: Widget Şablonlarını Genişlet' e tıklayın. Ctrl+F tuşlarına basın ve aşağıdaki kodu aratın
]]></b:skin>
bulmuş olduğunuz bu kodun üstüne alttaki CSS kodunu yapıştırın;

.author-comments {
background: #ffffff;
color: #000;
border: 2px solid #666666;
padding: 5px;
}

Not: "color" yazı rengini, "background" arka plan renginini değiştirmenize ve "border" yorum alanına çerçeve yapmanıza yarar.

Ekstra: Eğer yorumların arka planına resim yerleştirmek isterseniz yukarıdaki CSS koduna alttaki kodu ekleyebilirsiniz.

background: url(http://kullanilacak-resim-web-adresi.jpg)

Adım 4: Ardından altta verilen kodda kırmızı ile renklendirilmiş alanları temanızda uygun yere yapıştırın. Sadece kırmızı ile renklendirilmiş alanlar temaya eklenecek. Diğer kısımlar referans olması için koda eklenmiştir.
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
der ki...
</dt>

<b:if cond='data:comment.author == data:post.author'>
<dd class='author-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/>


<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:
comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
Unutmayın sadece kırmızı ile renklendirilmş alanları temanıza eklemeniz gerekiyor. Doğru yere kodu yapıştırmanız adına diğer kısımlar örnek olarak koda eklenmiştir.

Adım 5: Temanızı görüntüleyin ve eğer sorun yoksa, şablonunuzu kaydedin.

Kolay gelsin.

Bu yazıyı beğendiyseniz lütfen Sosyal Ağ tuşları ile destek olun...
Yorum
as dedi ki...
blog içeriğiniz ve yazılarınız güzel, birçoğunu denedim ve oldu.blogunuzu takip edeceğim.
Blogog.net
Sade dedi ki...
Elimden geldiğince doğru bilgi vermeye ve az da olsa blogger kullanıcılarına yardım etmeye çalışıyorum. Yazılarımın bloglarda uygulanması ve beğenilmesi beni çok mutluy ediyor. Değerli yorumunuz için teşekkürler...
kucuksheyler dedi ki...
ayrıntılı anlatımınız sayesinde kolayca uyguladım. her şablon değiştirdiğimde yararlanıyorum blogunuzdan. bilgiler için teşekkür ederim.
Ömero dedi ki...
Pek çok konuda ayrıntılı ve bir o kadar da "temiz bilgi" alışverişi yaptığınız için teşekkürler. Siteniz, benzer blogger siterler arasında yayınını beğendiğim bir düzeyde. Tüm emeklerinizden dolayı sizi kutlarım. Başarılar...