22 Temmuz 2010

Blogger'e Resimli Benzer Yazılar (Related Posts) Eklemek

Birçok sitenin kullanmakta olduğu Benzer Yazılar (Related Posts) özelliği, ziyaretçilerin blogda dolaşımını kolaylaştırmak için tavsiye edilen bir eklentidir. Yazı Sonuna Eklenebilen ve Kişiselleştirilebilir Resimli Benzer Yazılar özelliği blogger  sitene ekleyerek  siteni daha cazip bir hale getirebilirsin.

Nasıl Eklenir?

1. Adım: 
Öncelikle Oluşabilecek hataları gözönüne alarak şablonun bir yedeğini bilgisayarınıza indirin. (indirme bağlantısı var.)
Blogge Giriş Yaptıktan sonra /Kumanda Paneli /Tasarım /HTML'yi Düzelt / Widget Şablonunu Genişlet Bölümlerinden;
CTRL+F (Arama) tuşları yardımıyla aşağıdaki kodu bulacaksınız:
</head>
 2. Adım:  Bulmuş olduğunuz bu kodun üst satırına alttaki kodu yapıştırın;
<!--Benzer Yazi Baslar-->
<!-- kaldır --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="http://i39.tinypic.com/2n67qx5.jpg";
var maxresults=6;
var splittercolor="#d4eaf2";
var relatedpoststitle="Benzer Yazılar";
</script>
<script src='http://www.weebly.com/uploads/2/2/1/0/2210502/related-posts.js' type='text/javascript'/>
<!-- kaldır --></b:if>
<!--Benzer Yazi Biter-->
3. Adım: Sonra temanızda alttaki kodu bulun;

<p class='post-footer-line post-footer-line-1'>
4. Adım: Bulmuş olduğunuz koddan hemen sonra alttaki kodu yapıştırın;
<!-- Benzer Yazi Kodu Baslar -->

<!-- kaldır --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- kaldır --></b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
</b:if>
</b:if>

<!-- Benzer Yazi Kodu Biter -->
5. Adım : Yukarıdaki kodda isteğe bağlı olarak şu değişiklikler yapılabilir. Bunlar;

Benzer Yazılar yazısını istediğiniz şekilde değiştirebilirsiniz.

► Yazıların altında görüntülenmesini istediğiniz benzer yazı sayısını değiştirmek için;

max-results=6;
kodunda yer alan sayısı değiştirebilirsiniz. Benzer yazı sayını gösteriyor.

► Resimsiz yazılarınızda  http://i39.tinypic.com/2n67qx5.jpg  linkindeki resim gösteriliyor. Dilerseniz bunu değiştirebilirsiniz.

► Ayrıca yine ilk kodda yer alan .js uzantılı dosyayı (http://www.weebly.com/uploads/2/2/1/0/2210502/related-posts.js) indirin ve .js yükleyebileceğiniz bir siteye yükleyin.

►İlgili görüşlerinizi,  sorunları beyan etmede yorum bölümünü kullanınız.

0 yorum:

Yorum Gönder

Ziyaretci içerik hakkında düşüncelerini bizimle paylaşmak ister misin?