Skip to main content
Mister Design

follow us

Sekedar info saja, sekarang Mister Design adminnya sudah berganti!!

×

Membuat Breadcrums SEO Friendly Ala Arlina Design

Template dengan Breadcrumbs yang SEO Friendly akan meningkatkan page rank di Google, maka dari itu jangan di anggap remehkan Breadcrumbs ini. Kali ini saya akan membagikan breadcrumbs yang di pakai oleh blog Arlina design.

Baca juga : Cara Efektif Mempercepat Loading Blog Agar Lebih Ringan.

Dengan Anda memasang breadcrumbs yang SEO Friendly maka, artikel / postingan Anda akan cepat terindex oleh Search Engine. Breadcrumbs pula berguna untuk menginformasikan kepada pengunjung mengenai kategori dari artikel / postingan yang ada di dalam blog tersebut.

Membuat Breadcrumbs SEO Friendly


Langkah pertama :

Login ke Blogger > Tema > Edit HTML. Lalu Anda Copy kode CSS dibawah ini di atas kode ]]></b:skin> atau </style>

/* Breadcrumbs */
.breadcrumbs {background:#fafafa;font-size:100%;height:45px;overflow:hidden;padding:0;border-bottom:0;position:relative;}
.breadcrumbs:after{display:inline-block;content:&quot;\f09b&quot;;font-family:fontAwesome;font-style:normal;font-weight:normal;font-size:18px;color:#768187;top:0;right:0;padding:12px 20px;position:absolute}
.breadcrumbs &gt; span {padding:0;}
.breadcrumbs a{color:#768187;font-size:13px;font-weight:normal;line-height:45px;}
.breadcrumbs span a {color:#768187;padding:10px 0;}
.breadcrumbs span:first-child  a{color:#768187;margin-left:20px;}
.breadcrumbs &gt; span:last-child {visibility:hidden;width:0;height:0;color:#768187;border-right:none;font-size:13px;font-weight:300;line-height:30px;}
.breadcrumbs span a:hover {color:#151515;}
.breadcrumbs a:hover {color:#151515;}

Langkah kedua :

Carilah kode HTML seperti dibawah ini,

<b:includable id='main' var='top'>...</b:includable>

Lalu Anda Copy dan Paste kode HTML dibawah ini tepat di bawah kode di atas

      <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='nofollow'/></span> <span><data:blog.pageName/></span>
        </div>
      <b:else/>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <b:loop values='data:posts' var='post'>
        <b:if cond='data:post.labels'>
        <div class='breadcrumbs'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'><i class='fa fa-home'/> <data:title/></span></a></span> <b:loop values='data:post.labels' var='label'><span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url + &quot;?&amp;amp;max-results=6&quot;' itemprop='url'><span itemprop='title'><i class='fa fa-caret-right fa-fw'/> <data:label.name/></span></a></span><b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> </b:loop> <span><data:post.title/></span>
        </div>
        <b:else/>
        <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'/></span> <span>Uncategories</span> <span><data:post.title/></span></div>
        </b:if>
        </b:loop>
      <b:else/>
        <b:if cond='data:blog.pageType == &quot;archive&quot;'>
        <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'/></span> <span> Archive for <data:blog.pageName/></span> 
        </div> 
      <b:else/>
        <b:if cond='data:blog.searchQuery'>
        <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='nofollow'/></span> <span> <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' rel='nofollow'/></span>  <span>All post</span>
        <b:else/>
       <span><a expr:href='data:blog.homepageUrl' rel='nofollow'/></span> <span><data:blog.pageName/></span> 
        </b:if>
        </div>
      </b:if>
      </b:if>
      </b:if>
      </b:if>
      </b:if>
      </b:if>
</b:includable>

Silakan Anda Save Template. Selanjutnya Anda kunjungi situs Google Struktur Data Testing Tools, untuk menguji apakah Breadcrumbs Anda sudah terpasang dengan baik atau tidak.

You Might Also Like:

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar