Minggu, 24 Juni 2012

0

Cara membuat Breadcrumb di Blog

  • Minggu, 24 Juni 2012
  • Setiawan Dimas
  • Share
  • Seperti yang sudah di jelaskan sebelumnya di artikel Cara membuat template blog lebih SEO friendly Breadcrumb merupakan sebuah menu navigasi yang ada diatas postinga atau artikel.Breadcrumb juga seringdipaakai oleh para master blog, Breadcrumb juga dapat meningkatkan SEO blog kita. Anda bisa menggunakan breadcrumb untuk memudahkan Navigasi pengunjung blog, Memasang atau membuat breadcrumb ini sangat penting dan sangat dibutuhkan untuk sebuah blog karena dengan memasang google breadcrumb, dapat menutupi salah satu kekurangan blogger yaitu alamat url posting yang terbatas dan kadang terlihat kurang bagus. oke cukup basa basinya langsung saja simak Cara membuat Breadcrumb di Blog berikut ini:

    • Langkah pertama sobat login dulu ke blog, itu pasti. kwa kwa kwa,,
    • Seperti biasa, kita langsung menuju halaman Design [Rancangan] » Edit HTML » Ceklis Expand Widget Templates (jangan lupa selalu backup template sebelum editing). Jika sobat menggunakan tampilan baru, silahkan klik Template » Edit HTML » Lanjutkan » Ceklis Expand Widget Templates.
    • Kemudian sobat cari kode <b:include data='top' name='status-message'/> biasanya ada 2 kode tersebut. Kalau sudah di temukan, silahkan paste kode berikut ini tepat di atasnya (paste aja di atas 2 kode yang sobat temukan biar tidak bingung).
    <b:include data='posts' name='breadcrumb'/>
    • Sekarang cari kode <b:includable id='main' var='top'> dan kalau sudah ketemu, paste kode berikut tepat di atas kode <b:includable id='main' var='top'>
    <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 www.wakrizki.net -->
    <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 and search pages www.wakrizki.net -->
    <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>
    langkah selanjutnya adalah cari kode ]]></b:skin> setelah itu tambahkan kode dibawah ini tepat di atas ]]></b:skin>
    .breadcrumbs{
          margin-left:10px;
          padding: 5px 0;
          border-bottom: 1px dotted;
          line-height:1.4em;
          }
     Setelah semuanya selesai save template anda,,,
    Itu saja artikel bloggerEksis kali ini dan mudah-mudahan bermanfaat buat para sobat blogger.

    0 Responses to “Cara membuat Breadcrumb di Blog”

    Posting Komentar

    Subscribe