Artikel Yang Paling Populer

Friday, April 03, 2009

Cara Membuat Related Post pada Blog

| Friday, April 03, 2009 | 33 comments

Anda mungkin sering melihat beberapa judul postingan yang berada dibawah kolom komentar disaat anda membuka sebuah judul postingan .Seperti contoh dibawah ini.

Judul postingan tersebut ada hubungannya dengan postingan yang anda buka selama postingan tersebut masih satu nama tag label.Misalnya Anda membuka suatu judul postingan yang mempunyai label tag ’Tutorial Blog’ maka judul postingan yang muncul dibawah kolom komentar tersebut adalah yang mempunyai tag label ’Tutorial Blog’ juga.Itulah yang bisa disebut Related Post atau biasa dijuga disebut artikel yang berkaitan atau artikel terkait ( terserah apa nama yang diberikan oleh pemilik blog).Dengan memunculkan Related Post maka pengunjung bisa dengan mudah menemukan informasi lain yang masih ada hubungannya dengan postingan yang sedang dibaca. Untuk membuatnya silakan anda mengikuti langkah-langkah berikut ini:
1.Login pada Blogger
2.Klik Layout pada Dashboard.
3.Pada Layout, klik Edit HTML dan centang Expand Widget Template.
4.Temukan kode <data:post.body/> .
5.Letakkan kod script dibawah ini tepat dibawah kode <data:post.body/>




<b:if cond='data:blog.pageType == "item"'>

<div class='similiar'>



<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>

</b:if>





6.Kemudian Save.
Gantilah kalimat Related Post dengan kalimat sesuai dengan keinginan anda.Misalnya artikel yang terkait atau kalau anda tidak ingin menggantinya biarkan saja.Coba anda membuka salah satu judul postingan pada blog anda, maka akan muncul Related Post berada dibawah postingan yang anda buka tadi.
Selamat mencoba.

33 comments:

Master VB said...

makasih infonya, saya coba dan berhasil. jadi yang related post itu judul or kawan-kawannya yang ada pada labels/kategori ya mas?

meonkbobs said...

Cara masang arsip ke blog gmn ya ?
Pliss ni Nubiee jadi Blogger ...

Dunia Komputer said...

Mantab bos...

sahabat blogger said...

waaah..saya coba kok ga bisa ya, sudah tersimpan seh di template nya. tapi related post nya kok ga muncul ya, malah form komentarnya ilang. gimana om??.. bantuin doong

Franky said...

@sahabat blogger, coba dilihat lagi kodenya dan cara penempatannya.Kalau sudah benar akan tidak ada masalah

shabit mig3erz said...

ok tak coba dulu

abby javeline caecillia said...

hm....
thanks bgt buat info-nya....

gue coba doeloe yah.....

aznas said...

thanks for your sharing

roysyasbana.co.cc said...

Nice info!
Aq coba sekarang d...

info said...

q uda muncul tapi kok kok gak bisa ngelink langsung kyak punyamu maz
link

sioliv said...

Keren... Aq dah coba beberapa tutor, baru yang ini berhasil. Tengkyu veri mach

infokomp said...

lam kenal...saya mau lamsung coba..makasih infonya

Gema said...

mantap bozz sudah saya pasang di blog, keren tipsnya

zackoverload said...

Kalo buat blogger via hp kaya saya, ada yang bisa bantu??? Masalahnya saya gak bisa copy code diatas... :|

Admin said...

Bang aku dah coba, tapi tidak m uncul diblogku, dan aku minta koreksi total agar blogku jadi canggih. Nuhun

attaqy mandiri said...

aku dah coba tapi gak muncul, di tempat ku itu ada post body nya ada dua, dah coba dua2 tetap gak bisa muncul...tolong infonya yah
attaqymandiri.blogspot.com

pt indonesia said...

Sip panduannya, tutorial dan kode yang diberika diatas bekerja dengan baik pada salah satu blog saya di blogspot.

Pertama agak kesulitan mencari kode , tapi setelah mencenteng expand widget, ternyata kode tsb bisa di dapat

trima kasih banyak untuk sharing-nya

-salam

Sasuke Suyono said...

Udah aku praktekan n BERHASILLLL...
makasih buanyyyaaaakkkk....

islamic family law said...

Tdny aku nyoba2 pake tutorial lain,tp ggl....Tp sth pake tutorial ini,berhasil.... Thx. :))

citromduro said...

salam kenal
trim tipsnya

chodot said...
This comment has been removed by the author.
chodot said...

trims tipsnya .. uda berhasil di blog saya thx bgt .. http://www.kangafif.com

COEPAST BLOG said...

makasih bro/sis, sekarang blog saya sudah dipasang related postnyaaaaa, thanks...

Deris said...

Makasih,

artikel yang bagus!
Sekarang blog saya jadi tambah indah.. hehe

tianika said...

Informasi yang sedang aku cari-cari ini..

ronnix said...

kl mo batasin jumlah artikel yang di muat related post gmn ?

Healthy Tips said...

Mantap NIch Sherenya.... Tadi saya coba di blog sy berhasil... makasih bos !!!!

mapia said...

ok mas..langsung dicoba ke TKP

TokoOnlineBaru said...

Ikutan nyoba ah...ngelihat blog agan kren bangetz banyak pengunjung harusnya sekalian ngeblog sekalian menekuni Peluang Bisnis Online Tanpa Ribet

Software Akuntansi said...

sy sudah nyoba yang lain tapi gak berhasil....dan ini satu2nya yang berhasil Thanks

blogging said...

sobat, saya udah coba berkali2 koq masih tetap ga muncul yah?? apa kita menaruh kode scriptnya setelah data:post.body/ atau setelah /div lagi. tapi udah saya coba dua2nya, tetap aja ga bisa.

alamat bandung said...

kalo semisal related post juga berisi isi postingan gimana ya?

Ilham Fatahillah said...

tutorial yang sangat mujarab. ane coba pake tutorial lain ga ada yang berhasil. tp pake tutorial ini langsung tok cer

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

Followers

 
© Copyright 2010. yourblogname.com . All rights reserved | yourblogname.com is proudly powered by Blogger.com | Template by o-om.com - zoomtemplate.com