Cara mudah dan gampang membuat Related Post Artikel Terkait blog

Cara  mudah dan gampang membuat Related Post Artikel Terkait blog :

1. Login ke Akun Blog Anda, dalam hal ini blogger karena saya menggunakan blogspot
2. Klik Templete,  lalu pilih Edit HTML
3. Kemudian anda cari kode <data:post.body/>, Gunakan CTRL+F agar pencarian lebih Mudah dan jika menemukan kode tersebut lebih dari satu, gunakan kode yang ke-2 dari atas.
4. Copy-paste kode berikut ini di bawah kode <data:post.body/> yang sudah saya jelaskan pada point nomor 2

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

<p style='font-style:bold;'>ARTIKEL TERKAIT:</p>

<div class='rbbox'>

<div style='margin:0; padding:10px;height:150px;overflow:auto;border:1px solid #ccc;'>

<div id='albri'/>

<script type='text/javascript'>

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

var maxNumberOfPostsPerLabel = 4;

var maxNumberOfLabels = 15;

maxNumberOfPostsPerLabel = 50;

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;albri&#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>

<script type='text/javascript'>RelPost();</script>

</div>

</b:if>

 5. Selanjutnya cari kode ]]></b:skin>

6. Copy-paste semua code berikut ini tepat diatasnya kode ]]></b:skin>

.rbbox{border: 1px solid #000000;padding: 5px;

background-color: #F2F2F2;-moz-border-radius:5px; margin:5px;}

.rbbox:hover{background-color: #EFFBEF;}

.rbbox ul li {

display : block;

background : url(http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png) no-repeat 0px 0;

margin-left : -10px;

padding-top : 0;

padding-right : 0px;

padding-bottom : 1px;

padding-left : 20px;

margin-bottom : 5px;

line-height : 1em;

border-bottom:1px dotted #cccccc;}

 7. Klik Save/Simpan Templete

KETERANGAN TAMBAHAN:

*ARTIKEL TERKAIT, = bisa diganti sesuai keinginan. misal: Related Post, Baca Juga, Read more ataupun yang lain terserah

*maxNumberOfPostsPerLabel = 50;  = jumlah posting atau artikel terkait yang ingin Anda tampilkan

 *maxNumberOfLabels = 3;  = jumlah label terkait yang ingin ditampilkan

*background-color: #F2F2F2; = warna background kotakan artikel terkait dan bisa diganti sesuai selera

*background-color: #EFFBEF; = warna background saat kursor menyorot olom tersebut

*http://i1237.photobucket.com/albums/ff469/indolaron/icon/005.png = icon didepan link

Sekian yang bisa saya bagikan dari saya mengenai Cara Mudah dan Gampang Membuat Artikel Terkait dibawah Posting  pada kesempatan kali ini. semoga membantu dan bermanfaat bagi anda semua. Saya ucapkan terima kasih karena sudah berkunjung ke blog yang sederhana ini. Dan terus kunjungi blog saya dan ikuti updatenya... ok !!!

loading...

Kamu sedang membaca artikel tentang Cara mudah dan gampang membuat Related Post Artikel Terkait blog Silahkan baca artikel Putra Anggo Blogger Kacangan Tentang Panduan Membuat Blog Yang lainnya. Kamu boleh menyebar Luaskan atau MengCopy-Paste Artikel ini, Tapi jangan lupa untuk meletakkan Link Cara mudah dan gampang membuat Related Post Artikel Terkait blog Sebagai sumbernya

Posted by Anggo Putra