Cara membuat Kamu ada di (breadcrumb) di blog

Cara membuat Kamu ada di (breadcrumb) di blog


Hai Sobat Blogger ! kembali lagi nih dengan artikel-artikel berkualitas dari rizaldi priantama blog yang selalu ada inovasi dan terobosan terbaru setiap update artikelnya.Oke lah topik kita kali ini yaitu cara membuat breadcrumb di blog, sebelum itu sobat blogger pasti bertanya-tanya, apa sih breadcrumb itu?
Breadcrumb adalah semacam denah lokasi tempat tersimpannya artikel kita di dalam label tertentu, sehingga, pengunjung bisa melihat artikel yang serupa di label tersebut. Hingga yang terbaru, script ini bisa hanya muncul ketika artikel itu dibuka ( bagi yang memiliki read more ) . Sobat bisa melihatnya di blog ini, diatas setiap judul artikel di rizaldi priantama blog ini. Menurut beberapa sumber, Breadcrumb juga sangat penting dalam SEO. untuk lebih jelasnya lihat gambar :



Okelah daripada banyak bicara, malah bikin bingung, langsung saja kita bahas bersama-sama disini :

1.) Baca basmallah
2.) Masuk ke alun blogger sobat
3.) Meuju ke Dashboard > Template > Edit Html > Lanjutkan
4.) centang tanda expand  template widget
5.) cari kode ]]></b:skin>
6.) Lalu letakkan kode dibawah ini tepat diatas kode ]]></b:skin 
Kode
.breadcrumbs{padding:8px 0px 10px 5px;margin:0px 0px 5px 0px;font-size:88%;border:1px double#e6e4e3}.pesankomen p{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzUFyJhqxI7UH9Bg-mz3bCRonWFnGHLcwAk_ucnvCEat6nKo6iiS6Jb-uyw3S3Oldqu8_ygF_ibrzIKXGdR_beoP2gzVuGknATbNAZpdU5wbauRRDmQAEqrM5yaVI5vU0jBT1XhhWkYBE/s1600/dialog-warning.png);background-position:1em 1em;background-repeat:no-repeat;font-family:Comic Sans MS;font-size:13px;-moz-border-radius:5px;padding:1em 1em 1em 70px}.cse{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8q2599QDt10DzC1QELHDpDc2ONbwoNr_C1NXGoyHE5qEUt_lEFGec7e923LdK6Px5WwSvzkp4LHRHeWaOO9I-GD_y5r4u1snrUFPWarMwpGmbZNbq8DrFV_D-wpvtl4dCRfrhXNF6uPk/s1600/bgbawahpost.png);background-repeat:repeat-x;border:1px solid#d2d2d2;-moz-border-radius:5px;line-height:1.6em;margin:2px 0;padding:10px}
7.) Lalu cari kode <b:if cond='data:post.title'> ( Jika ada 2 kode yang ditemukan, letakkan diatas kode pertama ) atau letakkan dibawah kode <div class='post hentry'>
8.) Lalu letakkan kode dibawah ini tepat di atas kode <b:if cond='data:post.title'> atau dibawah kode <div class='post hentry'>
Kode
<b:if cond='data:blog.pageType == &quot;item&quot;'><div class='breadcrumbs'><span class='Apple-style-span' style='font-family: Verdana, sans-serif;'>Kamu ada di </span> : <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>&#187; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><a expr:href='data:label.url + &quot;?&amp;max-results=5&quot;' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if></b:loop>&#187; </b:if><b><data:post.title/></b></div></b:if>
9.)  Jika sobat ingin mengeditnya ,
Ganti tulisan Kamu ada di dengan kalimat yang diinginkan misal : You are here 
Ganti tulisan Home dengan kata yang diinginkan, misal : Browser
Ganti kode &#187; dengan kode-kode lain yang diinginkan , misal  &#179;


10.) Terakhir simpan template dan lihat hasilnya


Contact Us

Nama

Email *

Pesan *

Back To Top