Cara Membuat Related Post

on Sunday, 14 October 2012

Cara Membuat Related Post-Dalam postingan blog kali ini Cara Design Blog akan memberika tutorial blogger cara membuat related post. Sebelum memberikan tutorial membuat related post pada blog. 
Perlu dijelaskan dahulu apa itu related post dan apa fungsi dari related post.
Related post diartikan sebagai sekumpulan link artikel yang terkait dengan artikel yang sedang dikunjungi. Artikel ini terkait karena kesamaan tema. Dalam postingan terdahulu Cara Design Blog membuat tutorial blog cara membuat label blog. Disinilah peran label blog. Label blog menghubungkan halaman yang kita kunjungi dengan halaman lain yang terkait atau memiliki label yang sama.
Lihat tampilan screenshoot related post Cara Design Blog berikut: 




Sekarang apa fungsi atau manfaat dari related post tersebut. Realated post memudahkan pengujung blog untuk mencari dan menemukan artikel yang terkait dengan halaman yang dikunjungi. Fungsi lain dari related post lainya membuat blog lebih SEO friendly. 

Bagaimana cara mudah membuat related post?
Mari simak tutorial blogger cara membuat related post berikut ini:
1. Masuk Dasbor Blog kamu.
2. Klik: Template >> Edit HTML > Lanjutkan >  Expand Widget Template.
3. Cari kode]]></b:skin>
Cara mudah mencari: CTR+F, Find: ]]></b:skin>

4. Letakan kode berikut Tepat di atas kode ]]></b:skin>

 #related-posts { float : left; width : 468px; margin-left : 5px; font-size: 12px; line-height : 1.8em; margin-bottom:10px; }
#related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; }
#related-posts a { text-decoration : none; }
#related-posts a:hover { text-decoration : none; }
#related-posts ul { margin : 10px 5px 5px 20px; padding : 0; }
5. Cari kode: </head>
6. Letakan kode berikut tepat di atas kode no.:5.
<script src='http://hbhost.googlecode.com/files/Related-posts.js' type='text/javascript'
7. Cari kode<data:post.body/>
Jika kode itu ada dua, pilih yang ke dua.

8. Letakan kode berikut tepat dibawah kode  <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<div style='font-size:18px'><b>Related Posts:</b></div>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if>
</b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>
</b:if>
Keterangan: Tulisan "Related Post" yang saya tulis hijau di atas bisa kamu ganti dengan More About, Baca Selengkapnya atau More. Terserah kamu mana yang kamu sukai.

9. Save Template.
Selesai, silahkan lihat tampilan blog kamu.

Cara Membuat Related Post 5 Unknown Sunday, 14 October 2012 Cara Membuat Related Post -Dalam postingan blog kali ini Cara Design Blog akan memberika tutorial blogger cara membuat related post. Sebelum...
       


Related Post:

  • Cara Menghilangkan Navbar BloggerCara Menghilangkan Navbar Blogger-Meski navbar telah di sembunyikan dengan cara menyembunyikan navbar blog, namun ternyata masih navbar tersebut sebenarnya masih ada hanya disembunyikan. Terus bagaimana caranya agar navbar blogger itu bisa hilang dar… Read More
  • Cara Membuat Read More Otomatis Pada BloggerCara Membuat Read More Otomatis Pada Blogger-Kali ini Cara Design Blogger akan memberikan tutorial blogger cara membuat read more otomatis pada blogger. Sebenarnya apa fungsi read more otomatis itu? Mengapa para blogger menerapkan read more otomatis … Read More
  • Cara Mudah Membuat Navigasi Breadcrumbs di Blogger Cara Mudah Membuat Navigasi Breadcrumbs di Blogger-Pada kesempatan ini Cara Design Blog akan memberikan tutorial blogger cara mudahmembuat navigasi breadcrumbs pada blog. Apa arti dan fungsi dari navigasi breadcrumbs itu? Navigasi Breadcrum… Read More
  • Cara Membuat Tombol Share Button di Atas Postingan Blog Cara Membuat Tombol Share Button di Atas Postingan Blog-Setelah kamu tahu cara membuat blog dan sudah membuat postingan blog atau artikel blog, tentunya kamu berharap artikel blog yang kamu buat ingin di ketahui dan dikunjungi banyak orang. Sala… Read More
  • Cara Membuat Related PostCara Membuat Related Post-Dalam postingan blog kali ini Cara Design Blog akan memberika tutorial blogger cara membuat related post. Sebelum memberikan tutorial membuat related post pada blog.  Perlu dijelaskan dahulu apa itu related post dan apa… Read More

3 comments: