Good Morning All.... Minggu
pagi yang indah, mau weekend maleeesnya minta ampyuuun..... mendingan
browsing-browsing aja deeh... siapa tahu ada tips yang bisa Pak De-i
bagi-bagi ke Sohib-Sohib tersayang semua.... hmmm..... Pak De-i dapat
tips baguus neeh... mau saya share ke teman teman chemua, yaitu tentang Menu/Navigasi
Breadcrumbs. Apaan tuh Menu/Navigasi Breadcrumbs yaitu menu navigasi
yang berada pada bagian atas pada judul posting, Sohib bisa lihat pada judul
postingan pak De-i kali ini, Sohib akan temukan urutan kronologi hingga sampai
akhirnya Sohib temukan artikel ini. jadi begitulah ujud dari Menu/Navigasi
Breadcrumbs, bagaimana, bisa dipahami dan di mengerti kan...?
Kalau Sohib masih bingung
beginilah kurang lebih bentuknya:
Hmmm... Ngapain sih pakai menu
navigasi breadcrumbs segala, bikin ribet aja edit HTML lagi... Bentar dulu gan,
Pak De-i kasih bocorannya kenapa Sohib selayaknya menggunakan navigasi
breadcrumbs ini, menurut info yang Pak De-i dapat si Cerdas ini (maksudnya
Menu/Navigasi Breadcrumbs) ini mampu mendongkrak posting Sohib semua agar mudah
terindex oleh mesin pencari seperti Eyang Google, Posting Sohib semua akan
muncul pada Bola ajaib Eyang Google, selanjutnya Eyang Google akan sarankan
kepada "Klien-nya" untuk berkunjung ke Blog atau Website Sohib
semua... Gimana, mantap kan...? Orang Makassar bilang "Mantap
Mentooong.... hehehehehe.."
Eh... Sohib, Pak De-i kasih tahu ya
sebetulnya Si Cerdas ini desain awalnya dibuat untuk Wordpress loh.. tapi gak
usah khawatir sekarang Si Cerdas ini sudah dapat di aplikasikan ke Blogspot,
seperti pada Blog Pak De-ini dengan kronologi sebagai berikut: Home >
Label > Posting. Menu ini akan muncul pada halaman posting, label, arsip,
dan tidak muncul di bagian homepage.
Menu/navigasi breadcrumbs juga membantu meningkatkan SEO dan SERP pada Blog Sohib
akan sangat terbantu oleh Menu/navigasi breadcrumbs ini, yaitu dalam
pemetaan oleh search engine dan juga menambah kepadatan keyword, mengingat
letaknya yang berada di bagian atas posting.
Jadi caranya gimana doong.... untuk
nanam Si Cerdas ini ke Blog Sohib, heheehe... malah pidato terus, begini neh
urut-urutan pemasangannya
1.Sohib Ganteng dan Cantik
Masuk dulu ke menu dashboard pada
Blog selanjutnya pilih Design/Rancangan
selanjutnya klik pada Edit HTML,
oooooppss... Sohib centang dulu pada kotak kecil bagian atas yang ada
tulisannya: "Expand Widget Templates"
2. Langkah selanjutnya adalah
Cari kode ini; ]]></b:skin>
Untuk mempermudah pencarian Sohib bisa melakukannya dengan tekan Ctrl + F pada
keyboard komputer Sohib, kalau udah ketemu taruh script di bawah ini diatas
kode tadi (]]></b:skin>)
.breadcrumbs {padding: 5px 5px 5px
0px; margin: 0px 0px 15px 0px; font-size:95%; line-height:1.4em;
border-bottom:3px double #e6e4e3;}
3. Gimana, langkah ke-2 sudah ketemu
kan...? Pinterrrrrr.... selanjutnya cari kode ini: <b:include
data='top' name='status-message'/> caranya masih sama,
pencet Ctrl + F Kalau udah ketemu taruh kode ini: kemudian tambahkan kode
ini <b:include data='posts'
name='breadcrumb'/> persis di bawahnya, awas jangan salah
4. Udah kembali ke Blog Pak De-i
lagi....? Siap-siap untuk kembali lagi ke blog Sohib semua dengan membawa Copy
kode ini <b:includable id='main' var='top'>
seperti biasa pencet Ctrl+F dan pastekan pada kolom pencarian (biasanya di
bawah sebelah kiri) untuk menemukan kode tersebut kemudian taruh
Script di bawah ini tepat di atasnya
atawa sebelumnya, jangan sampai keliru
ya...
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- No breadcrumb on home page -->
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- No breadcrumb on home page -->
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
5.Pasti Sohib udah kembali lagi ke
sini, pada De-i tahu Sohib kesana kemari untuk ikutin setiap instruksi yang Pak
De-i sampaikan, hehehe... Kaya' Pak De-i dulu waktu pasang Si Cerdas ini
(sambil tutup muka karena malu sama Sohib), Udah beres semua kan....? kalu udah
beres sekarang SAVE dan sekarang
Sohib udah nanam Si Cerdas Menu/Navigasi Breadcrumbs, Sohib tinggal tunggu
panennya untuk menuai banyaknya pengunjung ke Blog Sohib semua. Hmmmm...
Indahnya Berbagi kata Pak Ustadz....
Eiiitss... Jangan main kabur aja,
ada sedikit petuah neh... Perhatikan setiap detail instruksi, jangan sampai
salah memahami instruksi yang Pak De-i berikan, maksudnya kalau ada instruksi
dipasang di atasnya ya harus di atasnya jangan sampai sebelumnya ataua kalau
ada instruksi di pasang di bawahnya ya di pasang di bawahnya jangan sampai
setelahnya, ini neh contohnya:
<b:include data='top'
name='status-message'/><data:adStart/>
Sohib perhatikan pada Script
di atas terdapat 2 tag bersebelahan, jika Sohib harus memasukkan tag/kode baru
di bawah/setelah <b:include data='top'
name='status-message'/>, artinya Sohib
harus meletakkan benar-benar setelahnya, sehingga <data:adStart/> harus digeser
posisinya, atau kode/tag baru disisipkan di antara keduanya, jadinya akan
seperti ini
<b:include data='top'
name='status-message'/>
<b:include
data='posts' name='breadcrumb'/>
<data:adStart/>
Kalau
ada yang mau Copy Paste ke Blog Sohib-Sohib semua jangan lupa tampilkan juga
link Blog Pak De-i ya... biar Pak De-i ikhlas, kalau Pak De-i ikhlas Sohib akan
dapat manfaat tentunya... hehe
Hatur
Nuhuun...
0 komentar:
Posting Komentar