askan cara membuat breadcrumbs di Blogspot/Blogger. Kali ini saya akan menjelaskan cara membuat breadcrumbs yang SEO friendly dan semua label terindeks oleh Search Engine.
Breadcrumbs merupakan menu navigasi yang berada di atas judul postingan seperti yang ada di blog saya. Struktur ini tentu berbeda dengan WordPress, yang bisa membuat child category. Struktur di bloger hanya Home kemudian Label. Apabila memiliki beberapa label, maka akan terbaca seperti ini :
Home >> Label >> Label
- Login ke blogger
- Masuk ke Template > Edit HTML > Jangan lupa centang expland template widget
- Cari kode
- Lalu cari kode
<b:includable id='main' var='top'> - Simpan Template anda
.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}
<b:includable id="breadcrumb" var="posts"><b:if cond="data:blog.homepageUrl != data:blog.url"> <b:if cond="data:blog.pageType == "static_page""> </b:if></b:if></b:includable><br /> <div class="breadcrumbs"> <a expr:href="data:blog.homepageUrl" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479" rel="tag">Home</a> » <data:blog .pagename=""></data:blog></div> <b:else> <b:if cond="data:blog.pageType == "item""> <!-- 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" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479" property="v:title" rel="v:url">Home</a></span> <b:loop values="data:post.labels" var="label"> » <span typeof="v:Breadcrumb"><a expr:href="data:label.url" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479" property="v:title" rel="v:url"><data:label .name=""></data:label></a></span> </b:loop> » <data:post .title=""></data:post> </div> <b:else> <div class="breadcrumbs"> <a expr:href="data:blog.homepageUrl" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479" rel="tag">Home</a> » Unlabelled » <data:post .title=""></data:post></div> </b:else></b:if> </b:loop> <b:else> <b:if cond="data:blog.pageType == "archive""> <!-- breadcrumb for the label archive page and search pages.. --> <div class="breadcrumbs"> <a expr:href="data:blog.homepageUrl" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479">Home</a> » Archives for <data:blog .pagename=""></data:blog> </div> <b:else> <b:if cond="data:blog.pageType == "index""> <div class="breadcrumbs"> <b:if cond="data:blog.pageName == """> <a expr:href="data:blog.homepageUrl" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479">Home</a> » All posts <b:else> <a expr:href="data:blog.homepageUrl" href="http://www.blogger.com/blogger.g?blogID=4061889842333921479">Home</a> » Posts filed under <data:blog .pagename=""></data:blog> </b:else></b:if> </div> </b:if> </b:else></b:if> </b:else></b:if> </b:else> <b:includable id="main" var="top"> <b:include data="posts" name="breadcrumb"></b:include></b:includable>
EmoticonEmoticon