Cara Membuat Artikel Terkait

Cara Membuat Artikel Terkait (Related Posts) - Untuk memudahkan pengunjung menelusuri artikel-artikel di blog Anda, Anda 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.

Berikut langkah-langkahnya:

1. Login ke Account/Dashboard blog Anda. Masuk ke menu Edit HTML.
2. Backup dulu template (baca: Cara Backup Templates) Anda, 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.

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

Jika Anda sudah memasang 'Readmore Otomatis' maka harus menempatkan script related post di bawah kode <data:post.body/> </b:if>
Jika Anda memasang iklan di bawah posting, maka tempatkan script related post di bawah kode iklan tersebut.

Sekian dulu postingan mengenai Cara Membuat Artikel Terkait. Semoga berguna

Sekian artikel berjudul Cara Membuat Artikel Terkait, Semoga bermanfaat. URL artikel: http://javablogtrik.blogspot.com/2012/03/cara-membuat-artikel-terkait.html

Artikel Terkait: