Selasa, 30 April 2013

Cara Membuat Breadcrumbs di Blogger/Blogspot

Tutorial kali ini Cara membuat BreadCrumbs Di Blogger Atau Blogspot. BreadCrumbs Adalah Salah Satu Cara Membuat Blog anda Menjadi User Friendly. Jika Anda Belum Memiliki nya Sebaiknya bergegaslah Untuk Memasang BreadCrumbs Pada Blog Anda
Berikut Adalah Gambar BreadCrumbs/Navigasi



BreadCrumbs Blogspot, BreadCrumbs Blogger, Cara membuat BreadCrumbs Di Blogspot/blogger, Blogger BreadCrumbs


Ok. Tak Perlu Banyak basa Basi, Langsung Saja Ke Tutorial

Cara Mebuat BreadCrumbs Pada Blogspot Anda


  • Login Ke Blogger Anda
  • Click Pada Template
  • lalu Click Edit HTML

Click pada gambar Untuk Memperbesar
Click Tepat Pada Panah Kecil Berwarna Hitam Seperti gambar Di atas. Scrol Ke bawah Dan Temukan  ]]></b:skin>
Copy Code Di Bawah ini Tepat Di Atas Pada  ]]></b:skin> 

Click Mouse Kiri Anda Lalu Tekan CTRL+F lalu akan Muncul Kotak pencarian Seperti di bawah ini

Masukkan Code Ini <b:includable id='main' var='top'> Di Dalam Kotak Pencarian, lalu Tekan Enter

Jika Sudah ketemu, ganti Code Tersebut Dengan Code 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'/>

Click save pada template Anda, Dan Liat Hasil nya pada Postingan anda, Selamat Mencoba
Jika Anda Kurang Paham, Bisa Bertanya pada Kotak Commentar Di bawah ini