Son zamanlarda Search Console da Breadcrumb ile ilgili bir hata görmeye başlamış olabilirsiniz. Bu hatanın kaynağı, yakın zamana kadar kullanımda olan data-vocabulary.org işaretlemesini Google desteklemeyi bıraktı. Bunun yerine schema.org işaretlemesinin kullanılması önerilmektedir. Dolayısıyla neredeyse blogger alt yapılı web sitelerinin hemen hemen hepsinin kullandığı bu işaretlemeyi Search Console 'un tavsiyesine uygun bir şekilde değiştirmek gerekiyor.Kendi blog sitem için bulmuş olduğum, bu sorunun çözümünü içerik olarak da paylaşıp herkesin faydalanmasını istedim. İşlemlere başlamadan önce her hangi bir hata yapma olasılığınız için şablonunuzu yedeklemenizi tavsiye ederim.
Eğer temanızda zaten bir breadcrumb varsa ömce bunu bulmalısınız. Blogger tema menüsü altından HTML düzenleme sayfasını açın, genelde çoğu temada <b:includable id='comment-form' var='post'> satırı altında bulunuyor bulmak için editörün içerisine tıklayın ve CTRL+F kısayollarını kullanarak <b:includable id='comment-form' var='post'> satırını arayın. Eğer satır varsa ve breadcrumbs da oradaysa aşağıda görselde işaretlediğim gibi tüm kod bloğunu seçin ve yine daha aşağıda paylaşacağım kod ile değiştirin.
Örnek görsel
Yukarıdaki bu işlemin ardından aşağıdaki CSS kodlarını </head> etiketinin üstüne ekleyin.
Son olarak ise aşağıdaki satırı <b:includable id='main' var='top'> kodunun altına ekleyin, eğer varsa eklemeniz gerekmez.
Eğer yukarıdaki işlem başarısız olduysa yada temanıza uyum sağlamadıysa aşağıdaki kod parçasını kopyalayın ve ardından tema kodlarınız arasında CTRL+F kısayol tuş yardımı ile <div class="post-outer"> satırlarını arayın ve hemen altına bu kodu yapıştırın.
Tüm işlem bu kadar değil. Son olarak Search Console 'a gidip aşağıdaki görselde gösterildiği gibi hata düzeltmesini doğrulayın.
Eğer temanızda zaten bir breadcrumb varsa ömce bunu bulmalısınız. Blogger tema menüsü altından HTML düzenleme sayfasını açın, genelde çoğu temada <b:includable id='comment-form' var='post'> satırı altında bulunuyor bulmak için editörün içerisine tıklayın ve CTRL+F kısayollarını kullanarak <b:includable id='comment-form' var='post'> satırını arayın. Eğer satır varsa ve breadcrumbs da oradaysa aşağıda görselde işaretlediğim gibi tüm kod bloğunu seçin ve yine daha aşağıda paylaşacağım kod ile değiştirin.
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.pageType == "item"'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a class='homebread' expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span></a>
<meta content='1' itemprop='position'/>
</span>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
<b:loop index='num' values='data:post.labels' var='label'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:label.url + "?&max-results=16"' expr:title='data:label.name' itemprop='item'>
<span itemprop='name'>
<data:label.name/>
</span>
</a>
<meta expr:content='data:num+2' itemprop='position'/>
</span>
<b:if cond='data:label.isLast != "true"'>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
</b:if>
</b:loop>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
<span>
<data:post.title/>
</span>
</div>
</b:if>
</b:loop>
</b:if>
</b:includable>Örnek görsel
Yukarıdaki bu işlemin ardından aşağıdaki CSS kodlarını </head> etiketinin üstüne ekleyin.
<style type='text/css'>
/* Breadcrumb */
.breadcrumbs{background:#fff;line-height:1.2em;width:auto;overflow:hidden;margin:0;padding:10px 0;border-top:1px solid #dedede;border-bottom:1px solid #dedede;font-size:80%;color:#222;font-weight:400;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap}
.breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#222}
.breadcrumbs a:hover{color:#11589D}
.breadcrumbs svg{width:16px;height:16px;vertical-align:-4px}
.breadcrumbs svg path{fill:#222}
.homebread{margin:0 2px 0 0}
</style>Son olarak ise aşağıdaki satırı <b:includable id='main' var='top'> kodunun altına ekleyin, eğer varsa eklemeniz gerekmez.
<b:include data='posts' name='breadcrumb'/>Eğer yukarıdaki işlem başarısız olduysa yada temanıza uyum sağlamadıysa aşağıdaki kod parçasını kopyalayın ve ardından tema kodlarınız arasında CTRL+F kısayol tuş yardımı ile <div class="post-outer"> satırlarını arayın ve hemen altına bu kodu yapıştırın.
<b:if cond='data:blog.pageType == "item"'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a class='homebread' expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span></a>
<meta content='1' itemprop='position'/>
</span>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
<b:loop index='num' values='data:post.labels' var='label'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:label.url + "?&max-results=16"' expr:title='data:label.name' itemprop='item'>
<span itemprop='name'>
<data:label.name/>
</span>
</a>
<meta expr:content='data:num+2' itemprop='position'/>
</span>
<b:if cond='data:label.isLast != "true"'>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
</b:if>
</b:loop>
<svg viewBox='0 0 24 24'>
<path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/>
</svg>
<span>
<data:post.title/>
</span>
</div>
</b:if>
</b:loop>
</b:if>
Tüm işlem bu kadar değil. Son olarak Search Console 'a gidip aşağıdaki görselde gösterildiği gibi hata düzeltmesini doğrulayın.
Blogger Breadcrumb Kurulumu Nasıl Yapılır ?
Öncelikle belirtmeden geçemeyeceğim bu eklentinin kurulumu yapılınca hemen etkili sonuçlar alınamayabilir. Yani yazıların, kategorilerin veya diğer içeriklerin google ve diğer arama motorları sonuçlarında breadcrumb tarzı sonuçlar çıkması için kurulumu yapıldıktan sonra biraz zaman geçmesi gerekmektedir.1.Aşama Css Kodları
Css kodlarının nereye ve nasıl bir şekilde ekleneceği biliniyordur ancak ben yine de belirtmiş olayım </b:skin> kodu aratılıp öncesine eklenmelidir..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}2.Aşama
Alttaki uzunca kod <b:includable id='main' var='top'> öncesine eklenmelidir ancak bu kodun altında <div class='blog-posts hfeed'> olması gerekmektedir. Ayrıca Web Günlüğü yazan yerler kendinize ait blog başlığı ile değiştirilmelidir.<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 == "item"'>
<!-- 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 == "true"'> » <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Kategorisiz
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- 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> » <data:blog.pageName/> Arşivi
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'><data:blog.title/></a> » Tüm Yazılar
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:blog.title/></a> » <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
3.Aşama
İkinci aşamayı başarılı şekilde tamamladıktan sonra <div class='blog-posts hfeed'> kod aratılıp altına veya bu <b:include data='top' name='status-message'/> kod aratılıp üstüne alttaki kod eklenmelidir.<b:include data='posts' name='breadcrumb'/>
Daha Fazla Radyo için 
Daha Fazla Televizyon için .png "English"){kind=small}
Hiç yorum yok:
Yorum Gönder