Menampilkan Label Posting di atas Post Title (Breadcrumb)Menampilkan Label Posting di atas Post Title (Breadcrumb)

Navigasi Breadcrumb adalah sebuah hiearchy label posting yang diawali dari homepage. Link homepage berada diujung paling kiri baru kemudian diikuti induk label hingga yang terakhir adalah anak terkecil label. Sebuah hal yang sementara ini masih mustahil untuk ditampilkan secara sempurna karena blogger masih belum menggunakan hiearchy label seperti halnya yang digunakan di widget arsip. Sekalipun demikian, menampilkan label posting di atas setiap judul posting (hanya di post page) tetaplah sangat berguna. Selain membuat blog menjadi lebih menarik, menampilkan label posting di atas judul posting akan lebih mempermudah pembaca untuk mengakses posting berdasar label.

D E M O

Anda bisa melihatnya di atas judul posting.

Cara membuat

1. Login ke Blogger
2. Dasbor (Dasboard)
3. Template
4. Backup/Restore Template. Panduannya bisa dibuka disiniKlik untuk mengikuti panduan cara melakukan backup/restore template.
5. Edit HTML
6. Template › Edit HTML
   • Procced (Lanjutkan)
   • Expand Widget Template
   • Cari Kode : <b:includable id='post' var='post'>
   • Gunakan Ctrl + F untuk mempermudah & mempercepat pencarian.
   • Ganti kode tersebut dengan xHTML yang tersedia di bagian bawah.
   • Simpan Template/Save Template
7. Selesai...
8. Buka blog halaman Posting untuk melihat hasilnya.

xHTML

<b:includable id='post' var='post'>
<div style='padding:5px 10px 5px 10px;margin: 0 0 10px 0;font-size:90%;line-height:1.2em;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiObOUtoyc75QTDpT9svVftM9a86VNnx4T5kFhww9ZNvp4K9ZSHjMarJooE4j20HZ1a6u5VyIJqNEaDvmeZPYeyrQZ2U4W3WKOF_sCrCK-fTYlJ56c858fynzrBXU01lH0IXycwBfBC494N/s1600/gradient-transparent-WG.png) top left repeat-y;border-top:1px dotted #888;border-bottom:1px dotted #888;'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>
<br/><i><data:post.title/></i>
</b:if>
</div>

Membuat Post Title atau Judul Posting sebagai HyperLinkMembuat Post Title atau Judul Posting sebagai HyperLink

Jika anda mencermati post title atau judul posting yang ada di halaman posting, maka akan terlihat perbedaan dengan yang terdapat di homepage (halaman utama blog). Post title tersebut bukanlah sebuah link sehingga ketika anda mencoba mengarahkan cursor di atasnya (menyorot dg cursor) sama sekali tak ada reaksi apapun. Ini akan berbeda dengan yang kita jumpai di homepage karena post title yang tertuliskan disini merupakan sebuah link. Link yang berfungsi mengarahkan kita ke halaman posting (alamat) sesuai dengan post title yang terlihat.

Akan sangat bermanfaat jika post title di halaman posting kita rubah menjadi sebuah hyperlink. Dengan perubahan ini post title bukan lagi sebuah teks biasa, namun merupakan sebuah hyperlink yang bisa membuat pengunjung kita bawa untuk berkunjung di blog atau web lain. Sebuah tag "a" kita tambahkan pada kode html yang terletak di bagian body, dimana sebuah alamat tertentu (URL) kita tambahkan di dalamnya.