Membuat Link Title & Open in New Tab di Tab Menu BloggerMembuat Link Title & Open in New Tab di Tab Menu Blogger

Jika anda sudah membuat tab menu horizontal blogger (navigasi menu horizontal) memanfaatkan fitur Laman atau Pages yang terdapat di dasbor (dasboard), maka di bawah header atau di atas post title akan terdapat sebuah navigasi menu horizontal yang berisi link ke posting di halaman static atau ke blog/web lain. Dalam tab horizontal ini sebenarnya tetrsedia kemungkinan untuk menampilkan link title saat cursor diarahkan ke setiap menu (muncul dalam bentuk tip) dan bisa juga dibuat menjadi open in new tab (dg kode target="_blank"), cuma kita harus melakukan penambahan kode di bagian body setelah dilakukan Expand Template Widget.

Buat Tab Horizontal Blogger dg Fitur Laman/PagesBuat Tab Horizontal Blogger dg Fitur Laman/Pages

Klik gambar agar anda bisa melihat screenshots dalam ukuran yang lebih besar!Horizontal Tabs Menu atau Tab Navigasi Horizontal Blogger merupakan sebuah daftar menu yang terletak di bawah header blog atau di atas halaman posting. Tabs ini memuat link atau hyperlink yang dapat berisi daftar posting di halaman statis dan alamat blog/web lain. Dengan memanfaatkan fitur "Laman" atau "Pages", sebuah tabs horizontal dapat dibuat tanpa perlu menambah kode css baru. Blogger telah menyediakan semua kebutuhan kode berkaitan dengan terbentuk dan berfungsinya tabs/navigasi horizontal ini. Anda bisa langsung membuatnya melalui halaman "Dasbor/Dasboard" - "Laman/Pages", kemudian memasukkan "Nama dan Link" untuk "tabs dengan alamat blog/web lain" dan "membuat posting beserta judulnya" saat ingin menampilkan "judul posting halaman statis" di tabs horizontal. Agar lebih jelas silahkan klik gambar di atas dan ikuti tutorialnya.

Menambah Navigasi Angka u lengkapi Newer-Older BloggerMenambah Navigasi Angka u lengkapi Newer-Older Blogger

Membuat sebuah navigasi halaman blogger baru yang dengan mudah bisa menampilkan beberapa posting sekaligus, seperti yang ada di homepage sangat penting karena akan membuat pengunjung lebih mudah menelusuri data posting yang ada di blog. Kemampuannya untuk diatur dalam menampilkan jumlah posting juga membuat widget ini sangat menarik dan mempunyai nilai lebih. Anda bisa mengatur jumlah posting yang ditampilkan dalam jumlah yang diinginkan, sekaligus juga bisa mengatur berapa banyak angka navigasi yang akan digunakan. Menggunakan navigasi angka ini juga sangat baik untuk melengkapi navigasi blogger default yang hanya ditampilkan di halaman posting yang berfungsi untuk mengakses posting yang lebih baru dan lebih lama (newer & older post). Agar beban loading tidak terlalu berat ketika pengunjung memanfaatkan fasilitas navigasi yang baru ini, sebaiknya anda mengatur jumlah tampilan posting disetiap halaman dalam jumlah yang tidak terlalu banyak. Menggunakan readmore menjadi sebuah keharusan agar tidak semua materi posting ditampilkan secara utuh yang pada akhirnya hanya akan menjadi beban lebih bagi loading blog.

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>