Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog - Hallo sahabat Anak Google, Pada Artikel yang anda baca kali ini dengan judul Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog, admin mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. Mudah-mudahan isi postingan Artikel Blogger, Artikel SEO blogger, Artikel Tutorial Blog, yang kami tulis ini dapat anda pahami. Selamat membaca ya.

Judul : Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog
link : Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog

Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog

Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog. Pada kesempatan kali ini Anak Google akan membagikan sedikit ilmu/tutorial Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog. Pasti sobat sudah tahu kan website kompas.com, jika anda melihat pada sisi kanan pada salah satu postingan yang anda baca, maka anda bisa melihat related posts yang berada disana.

Diambil dari kompas.com

Related posts ini bisa menunjang SEO blog kita lho, karena search engine menyukai sebuah website/ blog yang memberikan navigasi untuk memudahkan pengunjungnya untuk menelusuri satu-persatu halaman web/blognya.

Cara ini saya dapatkan dari sobat Jusman Online beliau berhasil memodifikasi kode recent posts yang ada pada blog saya dengan kreasinya sendiri dan berhasil menciptakan Related Posts di Sisi Kiri dan Kanan Pada Blog.


Untuk cara membuatnya ikuti langkah-langkah berikut:
1.Log in ke blogger.
2.Klik template  » Edit HTML » centang Expand Template Widget.
3.Cari kode </head> dan letakkan kde dibawah ini tepat di atasnya:

<style> #related-posts { float : left; width : 300px; margin-top:2px; margin-left : 5px; margin-bottom:20px; font : 11px Arial;  color:#FF0080;margin-bottom:5px; } #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 { color:#116f9e;text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht2BTqsLqAclx5V8M0Z6L2ylxBnzC_NmT3oZdLqQgqKO4VdkLUCvLeJAqYrDE0w6E13m8OYXNaKSigs6OKVySF7Z8J9_UAcB9xFor3qZjkJnGizKA-LNmH5Gx43vnPQYx1p7zNclRMW0g/s320/titik.png") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 10px; margin-bottom : 5px; line-height : 1.5em; border-bottom:1px dotted #cccccc; } </style> <script src='http://yudatfort.googlecode.com/files/related%20posts%20b-digg.js' type='text/javascript'/>

4.Kemudian cari lagi kode  <div class='post-body entry-content'> atau  <div class='post-header-line-1'/> dan tempatkan kode dibawah ini tepat dibawahnya:

<div style='float:left; margin : 0px 10px 0px 0px'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<font face='Arial' size='2'><b> TERKAIT : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><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> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
</div>

Source code from: Cara Membuat Related Post di Sisi Kiri/Kanan Blog seperti Kompas.com
Keterangan :

• Kode Left yang saya beri warna hijau menunjukkan posisi related postsnya disebelah kiri, jika anda ingin meletakkannya disebelah kanan maka ubah menjadi Right.
• Untuk ukuran lebar recent posts-nya bisa anda sesuaikan dengan merubah kode yang berwarna kuning.

5.Save template anda dan lihat hasilnya.

Sekian tutorial kali ini yang membahas Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog mudah-mudahan bisa bermanfaat bagi anda.

Demikianlah artikel tentang Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog

Sekianlah artikel Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog kali ini, mudah-mudahan bisa memberi manfaat untuk pembaca semua.

Anda sekarang membaca artikel Cara Membuat Related Posts di Sisi Kiri dan Kanan Pada Blog dengan alamat link https://anakugoogle.blogspot.com/2012/12/cara-membuat-related-posts-di-sisi-kiri.html

Tweet

Unknown