Cara Membuat Related post dengan Mengelompokkan Label/Kategory

Cara Membuat Related post dengan Mengelompokkan Label/Kategory


Related post/artikel terkait merupakan salah satu yang terpenting untuk sebuah blog karena dengan adanya artikel terkait akan memudahkan pengunjung untuk mengetahui isi sebuah blog.
Membuat blog dengan artikel yang bagus,unik dan berkuwalitas dan didukung dengan adanya related post/artikel terkait akan mendorong seorang pengunjung untuk membuka artikel yang lain.
Keunggulan tutorial blog Cara Membuat Related post dari kang Roni ini yaitu bisa mengelompokkan artikel berdasarkan kategory/label,tapi jangan lupa pastikan artikel sobat sudah diberi label,untuk keterangan cara membuat label sobat buka aja link ini.
Kalau artikel sobat sudah berlabel langsung aja ikuti langkah-langkah Membuat Related post dengan Mengelompokkan Label/Kategory dibawah ini.

1.Login Blogger.com
2.Buka halaman Rancangan ---> Edit HTML
3.Download Template Lengkap untuk keamanan bila terjadi kesalahan dalam peletakan kode HTML.
4.Beri centang pada kotak Expand Template Widget untuk membuka seluruh kode template
5.Cari kode <data:post.body/>

Setelah ketemu taruh kode dibawah ini tepat dibawah kode tadi

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<br/>
<H2>Related Post:</H2>
<div class='rbbox'>
<div style='margin:0; padding:10px;height:200px;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 = 10;
maxNumberOfPostsPerLabel = 10;
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>

6.Save.

Hidupkan blog anda dengan mempraktekkan Cara Membuat Related post dengan Mengelompokkan Label/Kategory dari kang Roni,untuk keterangan lebih jelas kang Roni akan menjawab pertanyaan sobat di kotak komentar.

Related Post:

17 komentar:

hafiezers mengatakan...

thnks mas

http://myhafiezers.blogspot.com/

muryono mengatakan...

dah aku coba berkali-kali tapi gagal mlulu
tong bantu aku dong Kang Roni

http://muryonotianov.blogspot.com/

roni mengatakan...

Bila Bpk menemukan dua kode <data:post.body/>
pilih aja yang atas

PEMIMPI mengatakan...

ok kang nuhun.....


pemimpitinggi.blogspot.com

AKHLIS HIDAYATUL AKBAR mengatakan...

okeh saya coba
akhlisnurse.blogspot.com

Cuba-Tuleh mengatakan...

thanks mas infonya..
visit my blog www.cuba-tuleh.blogspot.com

Muhammad Hidayat mengatakan...

gmana gan, di template saya ada 4 kode yang sama, gmana nih gan..?

roni mengatakan...

sebelumnya download template dulu gan untuk jaga2,lalu coba pilih kode yg nomor dua.
bila tidak berhasil sobat coba aja semuanya kang roni dulu juga begitu selalu bereksperimen untuk menambah pengetahuan.oke selamat mencoba lagi semuga sukses.......

Muhammad Hidayat mengatakan...

oke dah gan, thanks ilmunya kang... saya coba lagi

aldie prasetya mengatakan...

Thnks ilmunya gan
aldieprazz22.blogspot.com

untuk langganan blog ini dimana gan ??

roni mengatakan...

kolom subscribe di atas sebelah kanan

Coretan mengatakan...

mana kok gak ada si kang
nya dah muter2 nyari adanya kya gini
.post-body {
position: relative;
}

.post-body img {
padding: 8px;
background: $(image.background.color);
border: 1px solid $(image.border.color);

roni mengatakan...

apakah sobat udah memBeri centang pada kotak Expand Template Widget untuk membuka seluruh kode template?

zaldi mengatakan...

thx gan info nya saya praktek dulu ,, dijamin sukses yaa ??? :)
thx infonya .

ruddesign mengatakan...

saya ada 3 kode nya udah dicoba ketiganya tetap ngk bisa kang...mohon pencerahannya kang?

roni mengatakan...

pastikan setiap postingan/artikel sobat sudah diberi label

Kasato Kazumi mengatakan...

gak bisa gan...owh iya please follow me kazumifamily.blogspot.com :D

Poskan Komentar