Minggu, 13 Januari 2013

Cara Membuat Related Post / Artikel terkait

Cara Membuat Related Posts Di Bawah Artikel Atau membuat artikel berkaitan dibawah postingan. Related posts yang ringan dan cepat loading ini sangat penting pada suatu blog , karena selain bisa menunjang SEO , related posts juga berfungsi untuk memudahkan pengunjung untuk mengakses artikel kita yang berkaitan dengan artikel yang sedang di baca oleh pengunjung.


Related Post  Berkaitan



Dengan artikel berkaitan yang simple dan cepat loading, maka pengunjung lebih bisa berlama-lama menelusuri blog kita, dan tentunya dengan Related Posts Di Bawah Artikel ini akan menunjang profesionalitas blog kita.

Fungsi dari related posts adalah menampilkan artikel yang berkaitan yang ada dalam blog kita. Masih belum paham..? misalnya sobat memposting artikel dengan label ikan bandeng, blogger tutorial, desain blogger, atau apa aja deh maka jika pengunjung mengklik artikel kita yang misalnya berlabel tutorial blog maka akan muncul menu dibawah postingan kita yang menyajikan artikel-artikel yang berlabel tutorial blogger.

Dibawah ini tampilan dari related posts nya :

Membuat Related Post  Berkaitan dibawah Postingan Artikel

Cara Membuat Related Posts Di Bawah Posting artikel.

1.Log in ke blogger dengan akun yang anda miliki.
2.Klik rancangan.
3.Edit Html » Centag kotak Expand template widget.
4.Cari kode /head>
5.letakkan kode dibawah ini sebelum kode </head  yang anda temukan.

&lt;style&gt; #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; 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 { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcoyuYmhY5zCiKzUEhmexlbi8ZWK0ZAuR2OxidXm-xhdAHjQrKMDEIaegxNPScmHjHGYZBlBarzaPqgJTod999xsN-jjWBcUY70KU7Y44qUuCRoAO_KSs5Nj6nYpMpzUx4Xp0W_o3Pr4E/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } &lt;/style&gt; &lt;script src='http://fispol.com/bisnis/vom.js' type='text/javascript'/&gt;

5.Sekarang cari kode <data:post.body/> jika ada dua pilih yang kedua dan letakkan kode di bawah ini dibawah kode <data:post.body/>.



<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>



6.Related Post selesai dibuat dan lihat hasilnya.

Sekian tutorial tentang Cara Membuat Related Posts Di Bawah Posting semoga bisa bermanfaat bagi kita semua. Bila masih ada kesulitan tentang cara membuat Artikel yang berkaitan dibawah artike ini, jangan sungkan bertanya dikotak komentar.

Artikel Cara Membuat Related Post / Artikel terkait ini ditulis oleh sahabat kita Geasera pada hari Minggu, 13 Januari 2013. Terimakasih atas kunjungan anda di Komunitas Blogger Nias Bersatu. Kritik dan saran tentang Cara Membuat Related Post / Artikel terkait dapat Anda sampaikan melalui kotak komentar dibawah ini. Dan jika anda ingin menyalurkan aspirasi melalui tulisan / berpatisipasi dengan kami silahkan :: Gabung Sebagai Penulis ::

:: Ya'ahowu !!!::


2 komentar:

postingan artikel yang bertautan memang membuat pengguna penasaran sob. thanks infonya

Simpel dan elegan. Ada yg pakai model thumbnail (gambar) namun menurut saya cukup membebani load, kecuali paham coding sehingga bisa mengakali kode-kode yg tidak perlu.