Cara membuat RELATED POST atau ARTIKEL TERKAIT versi lain ( lebih menarik )
Pada tips dan trik blog hari ini saya ingin memberitahukan bagaimana cara membuat RELATED POST atau ARTIKEL TERKAIT versi lain dari yang sudah sering kita lihat.
Tampilan nya cukup menarik dan tidak seperti yang biasa sering kita lihat di blog khusus blogspot lainnya.Anda bisa lihat sepeti di blog ini.Bagaimana?menarik bukan?
Artikel ini saya adopsi dari realtrix,blog luar negeri yang cukup menarik dan informatif.Artikel pakai bahasa inggris.Nah untuk anda yang belum mengerti banyak tentang bahasa inggris,saya tulis artikel di sini pakai bahasa indonesia :D
Ok...langsung aja,caranya ga terlalu sulit kok :
1. Masuk ke TATA LETAK --> EDIT HTML ( beri tanda centang pada kotak expand text widget )
2. Anda cari kode <data:post.body/>
3. Copy kode di bawah ini,dan letakkan di bawah kode <data:post.body/><b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>
4. Setelah itu anda cari kode </head>
5. Copy kode di bawah ini,dan letakkan diatas kode </head><style>
#related-posts {
float : left;
width : 540px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
color : #940f04;
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
color : #054474;
font-size : 11px;
text-decoration : none;
}
#related-posts a:hover {
color : #054474;
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://i299.photobucket.com/albums/mm297/zozuglogger/weed-bullet.gif") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 16px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
</style>
<script src='http://technotrixdebajyoti.googlepages.com/RelatedPostsByRealtrix.co.cc.js' type='text/javascript'/>
6. Save
7. Lihat hasilnya... :)
Penting:
1. Tulisan yang berwarna kuning,anda bisa ganti dengan kata-kata sesuai dengan keinginan anda
2. Tulisan warna hijau adalah jumlah posting yang ingin kamu tampilkan.
Bagaimana sukses ga? kalau ada kendala atau anda berhasil,anda bisa sharing di artikel ini dengan mengisi form komentar.
Selamat mencoba...
Referensi produk bisnis online untuk anda:
1.Dapatkan buku panduan bisnis online DISINI
2.Program baru bisnis online,sistem sederhana,lihat DISINI
Who am i ?
Siipp.....kerenz mas...berhasil... ^_^
di coba....
Langsung ke TKP :D
@all: thanks for comment :)
thanks,,, atas ilmunya
kok aku coba lum bisa ya bos.
ndak ada perubahan
apa harus pakai readnore dulu..?
thanks bos
@pras: ga harus pakai readmore.seharusnya bisa.mungkin ada yang salah.coba di cek lagi
saya coba tapi gagal..., saya punya dua "data:post.body/", dan dua2nya ada di dalam script 'AutoReadmore' saya, yang bawaan dari default template saya ga ada..
gimana tuh mas?
@Han: kalau udah ada defaultnya memang agak sulit ngeceknya,harus di hapus dulu kode buat masukin readmore nya,lalu di letakkan di data post body yang kedua
makasih mas...dicoba dulu..
udah muncul related postnya tapi gimana artikel gak muncul...gimana caranya???
Aku coba mas, cari info sana-sini, yg lain ribet..yg ini baru mantap, simple banget
thanks infonya...
kalau yg kayak di blog aku ayead.blogspot.com BLOGNYA ANAK GAPTEK
gimana cara edit warna background artikel terkaitnya ya??
coz tulisannya jad keliatan..
makasih n salam kenal
langsung aq coba bos
Wah makasih atas petunjuknya
Gak berfungsi boss, dah di coba berkali-kali tapi gagal terus boss.
hm... tipsnya menarik juga
makasih mas,,
kunjung balik ya
simple and mudah tapi sayang punyaku gak ada perubahan alias gak bisa gimana nihhh
Ptc Pilihan
pada tamplatq ga ada data-post-body
terus harus dipasang dimana
sip...mas. saya sudah pasang n makasih atas info nya. di tunggu kunjungan nya.
template saya tidak ada nya>gimana solusinya
Posting Komentar
Silahkan berkomentar,tapi jangan spam ya!