18 Aralık 2013 Çarşamba

Blogger Breadcrumb Navigasyon Eklentisi

Blogger Breadcrumb Navigasyon Eklentisi

SEO açısından önemli bir Blogger Eklentisi.Breadcrumbs arama motorlarının ve ziyaretçilerin sitede rahat gezmesi için oluşturulmuş başlık linkleridir. Böylece kullanıcı alt kategorileri inse de bulunduğu içeriğe nereden geldiğini görüntüleyebilir.
Breadcrumbs’ın Türkçe karşılığı ekmek kırıntısıdır.

Örnek Breadcrumb - Ana sayfa » kategori » konu ismi

Breadcrumb Nasıl Kurulur?

Alttaki kod bu kodun <b:includable id='main' var='top'> hemen öncesine eklenmeli.


<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- No breadcrumb on home page -->
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'><data:blog.title/></a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> &#187; <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
&#187;Kategorisiz
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'><data:blog.title/></a> &#187; <data:blog.pageName/> Arşivi
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<a expr:href='data:blog.homepageUrl'><data:blog.title/></a> &#187; Tüm Yazılar
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:blog.title/></a> &#187; <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

Şimdi </b:skin> kodunu aratıp aşağıdaki CSS kodlarını hemen öncesine eklemelisiniz.

.breadcrumbs{background-color:#fff; 
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border:1px solid #ddd; margin-top:5px; padding:10px; border-bottom:2px solid #ddd;
text-align:left;
font-size:11px}

Son olarak <div class='blog-posts hfeed'> kodunu arayıp bulduktan sonra üstüne aşağıdaki kodu ekleyin.

<b:include data='posts' name='breadcrumb'/>

SEO için çok iyi bir eklenti.Arama motoru sonuçlarında gözükmesi için ise biraz zaman alacaktır.

Hiç yorum yok:

Yorum Gönder