Cara Membuat Artikel Terkait (Related Posts)

Cara Membuat Artikel Terkait (Related Posts) - Untuk memudahkan pengunjung menelusuri artikel-artikel di blog sobat, sobat bisa menambahkan widget artikel terkait / related posts (baca juga: Cara Membuat Related Posts Bergambar). Fungsinya adalah agar setiap post/artikel yang terkait atau terbit dalam kategori yang sama, dapat ditampilkan juga dalam post yang sedang dibaca pengunjung. Biasanya, widget artikel terkait ini diletakkan di bawah postingan.

Selain itu, widget artikel terkait ini berguna untuk memudahkan pengunjung melihat artikel lain yang berhubungan dengan artikel (postingan yang aktif). Dengan adanya related post bisa meningkatkan pagehit pada blog anda.

Kode script di bawah ini Saya copy dari blog Leo.
Penasaran ingin membuatnya? Ikuti langkah-langkahnya berikut ini.

1. Login ke Account/Dashboard blog kalian. Masuk ke menu Edit HTML.
2. Backup dulu template (baca: Cara Backup Templates) kalian, untuk berjaga-jaga apabila ada kesalahan.
3. Kalo udah,beri tanda centang pada Expand Widget Templates.
4. Cari kode <data:post.body/> menggunakan CTRL+F pada browser. dan letakkan kode dibawah ini setelah kode tersebut.

(Nb: Akan ada 2 kode <data:post.body/> pada template yang sudah memakai fitur readmore. Oleh karena itu,pastikan kode berikut ini di letakkan setelah kode <data:post.body/> yang pertama.)

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Artikel Terkait</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 10;
var maxNumberOfLabels = 3;
maxNumberOfPostsPerLabel = 11;
maxNumberOfLabels = 4;
function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>

5. Save template dan lihat hasilnya.

*** Keterangan kode ***

<h3>Artikel Terkait</h3>                         <<----  Judul Widget.

var maxNumberOfPostsPerLabel = 10;       <<----  Jumlah post yang ditampilkan pada setiap labelnya.
var maxNumberOfLabels = 3;                    <<----  Jumlah label yang ditampilkan.
maxNumberOfPostsPerLabel = 11;             <<----  Jumlah maksimal post yang ditampilkan pada setiap labelnya.
maxNumberOfLabels = 4;                          <<----  Jumlah maksimal label yang ditampilkan.

Sesuaikan kodenya dengan selera kalian sendiri.

Sekian dulu postingan saya mengenai Cara Membuat Artikel Terkait. Semoga berguna

Ingin Berlangganan Artikel Terbaru ke email kamu? Masukan Email kamu disini:

Tidak tahu cara berlangganan? Klik disini

Related Post:

Blog

• Ribuan Backlink Gratis dari IMTalk
• Cara Memasang Tweetmeme di Setiap Postingan
• Cara Mendaftarkan Blog ke DMOZ
• Cara Membuat Short URL Google Plus
• Cara Daftar Google Plus (Google+)
• Google Update Pagerank Juli 2011
• Cara Menghapus dan Mengecek Broken Link Pada Blog
• Apa itu Google Plus (Google+) ?
• Tips Menghadapi Komentar Negatif
• Menambah Meta Tag Untuk Perkuat Postingan Kontes SEO
• Kontes SEO, Berbahaya!
• Pentingnya Menjawab Setiap Komentar di Blog
• Kenali Pengunjung Blog Anda
• 10 Artikel Terbaik Bulan Juni 2011
• Metode On Page dan Off Page SEO
• Cara Membuat Link Internal di Setiap Postingan
• Siapa Pengunjung Setia di Blog Anda?
• Tips Mendapatkan Pengunjung Setia di Blog
• Favicon Generate - Fitur Baru Blogger
• Cara Menambah Tombol Google +1
• DAW-XP Toolbar - Akses Cepat Menuju DAW-XP
• Cara Membuat Toolbar Alexa Sendiri
• Cara Memasang Alexa Widget
• Manfaat Alexa Toolbar
• Apa itu Alexa Rank?

Triks Blog

• Membuat Artikel Terkait Dengan Scroll
• Cara Membuat Reply Komentar
• Cara Mensubmit Artikel ke Lintas Berita
• Cara Mendaftar di Lintas Berita
• Cara Menambahkan Headline News di Blog
• Membuat Menu dan Sub Menu Horizontal
• Cara Membuat Tag Cloud Animasi
• Cara Backup Templates
• Cara Membuat Background Pada Widget Blog
• Cara Membuat dan Mengganti Favicon di Blog
• Cara Membuat Pesan Pembuka dan Kotak Dialog
• Cara Membuat Javascript Image Loader for Blog
• Cara Membuat Show-Hidden Widget di Blogspot
• Cara Membuat Artikel Terkait (Related Posts) Bergambar
• Modifikasi Tampilan Read more
• Cara Membuat Spoiler di Blog/Forum
• Cara Mengganti Style Font Blog
• Menghilangkan Icon Obeng dan Tang / Quick Edit di Blog

Anda sedang membaca artikel tentang Cara Membuat Artikel Terkait (Related Posts) dan anda bisa menemukan artikel Cara Membuat Artikel Terkait (Related Posts) ini dengan url http://daw-xp.blogspot.com/2011/04/cara-membuat-artikel-terkait-related.html, anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel Cara Membuat Artikel Terkait (Related Posts) ini sangat bermanfaat bagi teman-teman anda, namun jangan lupa untuk meletakkan link Cara Membuat Artikel Terkait (Related Posts) sumbernya.