BloonOnline GoTemplatez VersiEdan
Facebook Twitter You Tube Friendfeed
Blog Seo Intermezo

Bagaimana Cara Membuat artikel terkait atau related posts

Related Post atau Postingan Terkait itu sendiri banyak versi. Namun tujuannya tetap sama yakni menampilkan artikel terkait menurut kategorie atau label dari tulisan yang sedang kita baca. Dan ini biasanya sangat membantu jumlah PageView ( halaman yang di baca ) pada blog kita, Terutama bagi visitor yang ingin menggali lebih dalam artikel lainnya yang kita tulis.

Untuk tata letak bagusnya “ Related Post “ di simpan tepat bawah artikel, atau sedikit jarak dengan artikel.

* Perhatian

Dan perlu di ingat Post terkait ini akan berjalan atau terlihat jika artikel kita mempunyai label/kategorie/tag yang sama dari beberapa tulisan.

Related Post atau Artikel Terkait 

Menambah Script Artikel Terkait “ Related Post “

Berikut ini tahap-tahap untuk menambahkan script Arttikel Terkait ke dalam Template Blog.

1. Login/masuk  ke Blogger.com jika belum log in.

2. Pada halaman Dasboard masuk ke Layout ( tata-letak ), pilih tab Edit Html.

3. Kemudian tandai/centang kotak di samping tulisan “Expand Template Widget

4. Setelah itu tempatkan script berikut ini di bawah tag ]]></b:skin>

 

<script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>

 

5 Kemudian cari bagian ini, dan tambahkan seperti kode yang di beri warna

 

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'/>

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

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/>

</b:if>

</b:loop>
</b:if>
</span>

 

6. Sekarang cari kode baris post-footer berikut ini.

<div class='post-footer-line post-footer-line-3'>

kemudian masukan di bawahnya script ini.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='related-posts'>
<h4>Posts Terkait:</h4>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>
</div>
</b:if>

 

Simpan Perubahan ( save template ).

 

Jika ingin memberi style atau gaya pada tampilan Widget Related Post ini. kita bisa menambahkan pada halaman Css-nya, script berikut, sebelum tag ]]></b:skin>

.related-posts h4{
margin: 0 0 0 10px;
padding: 0 0 0;
font-size: ukuran font;
color: #nilai warna;
}

 

Untuk List

.related-post ul{
margin: 0 0 0;
padding: 0 0 0;
list-style-type:none;}
.related-posts li{
margin: 0 0 0;
padding: 2px 0px 0px;
list-style-type:none;
font-size: ukuran font;}
.related-posts li a{color: #nilai warna}
.related-posts li a:hover{color: #nilai warna; text-decoration:none;}

di tulis dari berbagai sumber.

usuariocompulsiv
templatesparanovoblogg

 

fun-and-happy

Page views this post: reader

99 komentar:

Bahauddin Amyasi said...

Jitu, Kang....
tapi kira-kira, loading blog kita gmn, Kang?
Parah nggak lemotnya? Hehe..

Narzis Blog's said...

Hmmm, keren sih kang...
Cuma mau nanya hal yang sama nih, loading blog bakal lambat gak..??
Loading blog'Q udah parah sih :D

JALOE said...

@ Bahauddin dan Narziz Blog

Bila di bandingkan dengan script yg lain menurut saya ini agak ringan .. :D

afdil said...

kok saya ndak berhasil?? dimana salahnya ya?

Oman said...

sebelum ke tkp ane mo tanya dulu kang..
ukuran font brapa? nilai warnanya juga..
newbi mode: on
tx atas infonya.

JALOE said...

@ oman

ukuran 12px atau 14px sudah cukuplah

untuk warna pilih yang kontras dengan blog kamu contoh: #3366FF - biru muda

Oman said...

makasih banyak kang jaloe..
siap ke tkp

Moel said...

Mantap mas,akan saya coba.trima kasih

JALOE said...

@ Moel

yup moga sukses :D

Rizky2009 said...

brhasil aq pasanag d blog q dan g ada masalah sip dach infonya

MULYONO W. said...

Bagus juga tips mampir sekalian tukaran link and follow yuk

ganool said...

yang ini caranya agak rumit..

Andry said...

Thanks mas akan saya coba deh

Eka Satria Taroesmantini said...

aku dah nyoba dan bisa. eh, aku mo nanya neh. Kenapa ya tulisannya keciiiiiiiil banget. termasuk tulisan "diposkan oleh", Tgl postingan" "0 komentar" dan di box profil tulisan "lihat profil lengkap" kecil juga. Gimana ya menormalkannya lagi? Thanks yaaa

EKO PURWANTO said...
This comment has been removed by the author.
Osi said...

Gak berhasil di blog saya...

Tito said...

Thx.. tipsnya berhasil di blog saya..

Makrus ali said...

sangat bermanfaat... terima kasih banyak, punyaku udah jadi dan nggak ada kendala sama sekali
salam kenal juga, mungkin temen2 mau liat hasilnya?

13 fakta tentang payudara

satuiku said...

Mantaap... udah nyoba dan sukses...

zona download said...

coba ahh...
makasih infonya..

kedai-obat said...

Thanks kang!! Info berguna..

TriENDEL said...

gak bisa!!!!

Berbagi Informasi said...

makasih info nya
kunjungi
http://infobersama97.blogspot.com/

Berbagi Informasi said...

kalo mau coba seperti saya klik di sini http://infobersama97.blogspot.com/2010/06/cara-membuat-posting-terkait-atau.html

Irwansyah Psa said...

Aku Juga Belum Bisa Nech... Dah Cobain..

dicky renaldy said...

thx ye oom

NovantachiStory said...

Wah makasih atas petunjuknya

enhal said...

kang..di template ku ga ada script label tu,...


....piye kang..xixixixii

investasi online terbaru dan tercepat said...

coba dulu mas. makasih atas triknya

Amin Tabin said...

Terima kasih atas info na..

InFo Ku uNtuK SemUa said...

a jg gagal gan gma ne

Hakim Kusumah said...

nice :)
coba gan...^_^

Hakim Kusumah said...

waduh...
kq ga bisa di blog saya????????

admin boogle said...

@Hakim Kusumah

mungkin template na ngga support ama kode ini

PIK Remaja Al-Hikmah said...

Langsung ke TKP saja tuk mencoba Kawan. Makasih tutorialnya

FARZANA WUSS ! said...

Terimakasih atas tips nya

karya anak indonesia said...

pelajaran bagus, sedot ilmunya deh !!!

Indonesia News Aggregator said...

terimakasih banyak atas informasinya sobat, ini akan sangat berguna untuk kita semua Job Feed Aggregator, General Forum Discussion

salam

endut said...

salam kenal sobat, saya yuniico di yogyakarta

Salam sahabat

Diamond Blizz

Best to Download

ardie said...

makasih info na,, kunjungi juga blog aku yah
http://ardiekoleksi.blogspot.com

Zeus Osiris said...

Thnk's infonya sob, dicoba dulu ah mudah2an berhasil...

Mushofa said...

berhasil gan
tengyu2... mampir saudagar2..
http://www.demidumy.co.cc

kadek05 said...

coba diterapkan dulu om...
aku baru belajar blogging ni agan2
mampir2 yo di
http://bacaberitaonline.blogspot.com

Rikusnaedi said...

100% berhasil.. makasih om
http://rikusnaedi.blogspot.com/

Poetra761 said...

Wah info2 yg sgt menarik..slmknal ya.blog pemula ni msh bljar,heE..

http://minority761.blogspot.com

Anonymous said...

klo mau hapus " read more" sama " artikel terkaitnya itu gimana ya mas tolong bantu ya soalnya susah tuh sampai sekarang ga k berhasil-berhasil........terima kasih
klo bersedia kirim ja ya ke email saya " wmubaroq@yahoo.co.id " di tunggu ya mas

seojaguars.com said...

mantab terima kasih atas infonya

Admin said...

artikel "related post" nya kurang lengkap gan...
sebelumnya mnta izin wat nyepam

sekalian ane mau berbagi wallpaper ni di http://moviesport-wallpaper.blogspot.com smoga agan agan suka ya
^_^

Admin said...

naruto

Android Phone Tips said...

nice info gan, tapi penembahan codenya buanyak bangetz ya,ada ga gan yang lebih simple..??

Android Phone Tips | Android Phone Tips

alat ukur kadar air said...

bisa dipasang nih

KangAom said...

No 5 ama no 6
EUWEUH EUyyyyy

fakih said...

mantabs.................he

yopie said...

saya masih blogger pemula, info ini sangat berharga buat saya
makasih bang, klo ad waktu mampir k blog saya, syukur2 bisa kasi saran yang mambangun :-)

om onny said...

terima kasih atas ilmunya

Rina As said...

Terima kasih untuk scriptnya...
Moga dapat pahala

siwok sintol said...

mantabbb gan

qudrat said...

Ini informasi yang saya butuhkan, Terima kasih atas sharing ilmunya, Oya kapan2 datang ya ke Blog saya di;
http://qudrat-inspirasi.blogspot.com
Salam...

Darmanto said...

berbagai cara sudah saya coba dan hanya artikel ini yg sukses saya pake walaupun agak rumit pemasangannya,trims bos....salam persaudaraan.

saeful fajar said...

bagus kang postinganya bisa saya coba nih,... salam kenal ya,...

Aulia Blog said...

kagak bisa....hiks

sejarah said...

Tak pasangnya dulu ya bang... :D

Juragan Pulsa said...

MAs, kodenya kok gak bisa ketemu ya?? ngumpet dmn ya?

j-r said...

wow, makasih mas tutorialnya..!!!

Mobil Keluarga Terbaik Di Indonesia

4hx.us said...

berhasil kang, dan loading blog jga gk terlalu terbebani,, makasih ya :)

irwan syah said...

makasih mas ,,,,
berhasil ne
mampir mas
berbagi&share ilmu komputer

chandra agung ,se.mm said...

paleeeeeeng

Admin Boriel Cyber said...

http://boriel-cyber.blogspot.com

dhicomp said...

Siap untuk Mencoba.
Salam Kenal.

Rizky Huda said...

makasih gan...kebetulan saya lagi butuh artikel tentang ini...
"untuk sobat bloger yang ingin tau info2 seputar musik dan tips2 tentang gitar mampir ke http://guitarid.blogspot.com/hehee...di tunggu loh. salam blogger selalu"

teknolike said...

wahh...jitu, udah dicoba di http://teknolike.com

Kartika Dewi said...

dah di coba kok g bisa ya mas ?? knapa ya

Dani said...

Alhamdulillah berhasil :D
Terima kasih :)

0blong said...

mencoba ini

0blong said...

saya sudah mencoba muncul tulisan related post nya tapi gag ada link yang terkait di bawahnya ini gimana ya??

file education said...

makasih gan ahirnya bisa bikin juga saya gan, terus berkarya gan. kunjugi n comment back gan :)

Panduan Blogspot said...

thx sob atas Panduan Blogspotnya
mampir sob di Panduan Blogspot

studio said...

terma kasih banyak mas. tutorial ini sudah saya terapkan di blog saya

doa untuk tahun 2012

Semoga tahun kitsa semua isa bertambah sukses.

Mr.X said...

Wah. . Wah . .

Ini yang aku cari dari tdi . . -_-"

thx yak

gatot susilo said...

sukses gan, jitu banget, persis seperti punya anda..
kunjungi balik blog ane gan..

|B|E|G|O| said...

manatab gan, main main ke blog saya ya gan

www.InfoPercetakan.com said...

Terimakasih gan... sy dah coba.
Awalnya agak ragu... eh ternyata...
BERHASIL.... !!

rasit ridho said...

makasih gan infonya @rasyid-ic

Chandra said...

wah keren trims ya tas infonya jganlu pa berkunjung ke blog aku juga http://dollarku-melimpah.blogspot.com/

Ridzal R Maulana said...

kerennn..
visit back ya
http://spot-newz.blogspot.com/

dev08 said...

bro..,,skriptny berhasil kupasang
thanks a lot.....,,

Fandi Adhitya said...

mantab gan..ringan buat blog ane

Kumpulan Artikel Menarik said...

wahh mantep pisan mas thanks ud share,slam blogger :)

Gopar said...

nice share sob

pangky felix said...

Thx bgt infonya...
bantu visit and follow ya
http://vector-blue.blogspot.com/
thx before

ARIATMAN said...

wah.. klu klu poin ke 5 < span > : kgak ada dlm template sy.. giman dong kk.. tolong d balas d blogku y kk..

menit said...

terimakasih sob..udah bisa dipraktekkan dan sukses nie..?

Darmawan Saputra said...

hanya sekedar mampir untuk meramaikan :D


#Salam Sehat

bima bhaskara said...

makasih info nya gan,
saling follow yah ^^
dan merapat di blog ane biar gk sepi hehehe
http://padang-hacker.blogspot.com

Fartafa said...

loading blog pasti bertambah berat dengan segitu banyak script yang nemplok

budiana wayan said...

terima kasih atas petunjuknya, kunjungi blogsaya juga...
http://smbjagasatru.blogspot.com/

KaY said...

thx buat infonya

melirik said...

Trim's ya boss semoga blog ini tambah jaya

Vino Jaja said...

maaf kayanya scriptnya ada yang salah tuh, soalnya tidak bisa di template saya.

Post a Comment

" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah

Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"

Makacih Atas Komentar-Nya

 

Copyright 2009. Home | Serba Serbi Google | XHTML | CSS Design by Catalog-Tutorial