Search This Blog

Memasang Breadcrumbs Di Blogspot

  • Saturday, June 16, 2018 at 8:51:00 PM
  • 3 Comments
  • Views
Aku berkali-kali kehilangan fitur Breadcrumbs setelah berkali-kali ngedit template blogku padahal udah di pasang dengan rapih, dan berkali-kali pula aku bolak-balik nyari tutorialnya lagi di Google. Setelah nyari di Google aku dapet kode yang pas dan bisa di terapkan di blogku. Oke langsung aja ke cara pemasangan nya.

Pemasangan
Simpan kode CSS ini di bagian style blog kamu.
/* Breadcrumbs */
.breadcrumbs{font-family: 'Monda', sans-serif;overflow:hidden;padding:8px 25px;text-transform:none;color: #fff;font-size: 13px;background-color: #4b515d;border-left: 10px solid #414753;}
.breadcrumbs a, .breadcrumbs a:link { transition: all 200ms ease-in-out 0s; color: #ddd; text-decoration: none; }
.breadcrumbs a:visited { color: #ddd; text-decoration: none; }
.breadcrumbs a:hover, .breadcrumbs a:visited:hover { color: #fff; text-decoration: underline; }
Cari dan ganti kode di bawah ini.
<b:includable id='main' var='top'>
Ganti dengan kode di bawah ini.
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>
Simpan template.

Referensi
3 comments
3 comments
  1. Maaf template anda bagua tpi pada post tidak enak untuk dibaca

    ReplyDelete