Cara Membuat Breadcrumbs SEO di Blogger/Blogspot
22 September 2013
Add Comment
Cara Membuat Breadcrumbs SEO di Blogger/Blogspot - Optimalisasi SEO memang sangat banyak sekali yang harus dilakukan seperti Mengotimalkan SEO on page dan SEO off page,seperti pada postingan sebelumnya saya sudah menshare cara bagaimana membangun SEO on page SEO off page anda bisa membacanya sendiri,
Namun ternyata optimalsasi tidak hanya itu saja dan ternyata ada cara lain yang tentunya juga sangat membantu pengoptimalan SEO blog kita yaitu dengan membuat menu navigasi diatas postingan atau Breadcrumbs,apa itu Breadcrumbs..???,bagaiamana cara membuat Breadcrumbs itu..??"(mungkin bagi anda yang masih nubie sama kayak adminJ tentu bertany-tanya tentang hal itu)"iya kan…iya kan…iya kan..????hahahaJ
Breadcrumbs bentuknya itu lebih tepatnya seperti ini :
Nah bagaimana Cara membuat Breadcrumbs gan..???tenang,kita akan membahasnya sebentar lagi,sebelum kita membahas lebih lanjut mengenai apa itu Breadcrumbs,saya mau membahas apa sih Breadcrumbs, apa sih gunanya untuk blog,dan apa sih hubungannya breadcrumbs dengan SEO blog..??oke mari kita kupas satu-satu biar nantinya tidak ada lagi dusta diantara kita..hahaha(kok kayak lagu ya J)
Oke mari kita awali pengertian dari braedcrumbs itu sendiri,breadcrumbs adalah menu navigasi/penunjuk arah halaman yang sedang dibuka dan letaknya diatas postingan halam tersebut,dan fungsi dari breadcrumbs adalah sebagai penunjuk arah untuk pengunjung sehingga mempermudahkan pengunjung untuk melacak lokasi dalam dokumen dan membantu pengunjung untuk kembali kehalaman utama.
Nah sekarang apa hubungan dan apa manfaatnya untuk SEO blog.?menurut buku tatang sutarma haha(wah minjem bukunya sule tuh..haha J),maksud saya dari tutorial-tutorial yang saya baca dari mbah gugel breadcrumbs sangat membantu meningkatkan SEO blog,karena dengan adanya breadcrumbs di blog anda maka artikel anda medah terindex oleh mesin pencari misalnya google,bing,yahoo dll.
Nah bagaimana cara memasnag breadcrumbs di blogspot kita,yang tertarik mbuat yuk simak selengkapnya….chekkidot
1. log in akun blogger anda
2. langsung anda menuju Template>>edit HTML(upps kelewatan….alangkah baiknya anda download dulu template anda sebelum anada meng editnya,jaga-jaga bila ada kesalahan saat mengedit, caranya klik cadangkan/pulihkan di pojok kanan atas>>download template lengkap)
3.kemudian cari kode ]]></b:skin>,agar lebih mudah tekan Ctrl F
4. letakkan kode dibawah ini tepat diatasnya :
.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}
5.kemudian cari lagi kode seperti ini <b:includable id='main' var='top'> ,kemudian jika sudah ketemu ganti kode tersebut dengan script dibawah ini:
<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></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'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Home</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' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</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'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <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'/>
6. lalu Save template dan liat hasilnya
7.kemudian buka salah satu postingan anda,jika sudah muncul menu navigasi di atas postingan anda maka breadcrumbs anda sudah berhasil dibuat.
Nah untuk mengetahui breadcrumbs kita sudah di index oleh google apa belum itu tergantung index artikel kita jika artikel kita terindex otomatis breadcrumbs anda akan terindex juga oke semoga bermanfaat….and happy blogging J
0 Response to "Cara Membuat Breadcrumbs SEO di Blogger/Blogspot"
Post a Comment