Cara Membuat Related Post (Artikel Terkait) pada Blog

Bagaimana Cara Membuat Artikel Terkait (Related Post) dengan Scroll Bar dalam postingan Blog atau tepatnya berada di bawah postingan blog. Seberapa penting sih memasang Artikel terkait di blog ?  Yang pasti sangat penting, dengan memasang Artikel Terkait di blog akan lebih memudahkan lagi bagi para visitor blog membaca dan melihat artikel-artikel yang berhubungan dengan artikel yang dibaca.

Dan jika dikreasikan dengan Sroll Bar akan lebih menghemat tempat di blog kita jika isi postingan sudah banyak.

Untuk cara memasangnya silahkan ikuti langkah-langkahnya berikut ini :

1. Login ke akun blog

2. Selanjutnya edit HTML lalu centang Expand Template Widget dan jangan lupa download template untuk berjaga-jaga jika terjadi kesalahan.

3.  Kemudian carilah kode berikut ini <data:post.body/> (gunakan ctrl+f untuk mempermudah pencarian)

4. Jika sudah letakkan kode di bawah ini tepat di bawah kode <data:post.body/>

Kodenya sebagai Berikut :

==================================

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class='similiar'>

<div style='border: 0px solid rgb(204, 204, 204); padding: 5px; overflow: auto; width: 100%; height: 300px; background-color: #ffffff;'>

<div class='widget-content'>

<h3>Related Post :</h3>

<div id='data2007'/><br/><br/>

<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;

var maxNumberOfPostsPerLabel = 4;

var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;

maxNumberOfLabels = 3;

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>

</div>

</b:if>

 ==================================

5. Simpan dan kemudian lihat hasilnya

Selamat Mencoba.....

Artikel Terkait :