-->

Cara Membuat Artikel Terkait (Related Post)

Tidak ada komentar

Cara Membuat Artikel Terkait (Related Post)
Cara Membuat Artikel Terkait (Related Post).
Artikel Terkait atau istilah Inggrisnya adalah Related Post memang sangat berguna pada blog. Karena dengan Related Post ini dapat membuat pengunjung tertarik dengan artikel kita yang lain, yang dalam kutip satu label. Karena Related Post ini ada dikarenakan label yang sama. Apabila tidak ada labelnya maka Related Post tidak akan muncul. Pastikan terlebih dahulu Artikel Anda memiliki label.
.
Sebelumnya, diatas adalah Artikel Terkait yang akan buat. Untuk memberi keterangan seperti teks-teks yang muncul sebenarnya bisa kok. Diatas memang sengaja penulis hilangkan keterangan tiap-tiap artikel jadi hanya terlihat gambar dan judul saja. Nanti akan penulis jelaskan apa saja yang dapat dirubah. Dan untuk tata caranya ialah sebagai berikut:
Ctrl+F.
Ctrl+F.
  • Yang pertama tentu saja log in lah terlebih dulu pada blog Anda. Kemudian silahkan klik Tema atau Template. Setelah itu silahkan klik Edit HTML.
  • Jika Anda sudah melihat sebagaimana pada gambar diatas. Maka silahkan klik terlebih dahulu di dalam kolom tersebut. Kemudian silahkan tekan tombol Ctrl+F untuk memudahkan mencari kata-kata. Silahkan ketik pada lingkaran pada bagian kanan atas tersebut dengan tulisan </head>. Jika masih belum ketemu coba ketikkan </head atau </hea saja.
<head
  • Sudah? Sampelnya ada pada lingkaran kiri atas pada gambar diatas. Nah selanjutnya kita akan menaruh kode data dibawah atau script dibawah, Anda dapat mendownloadnya disini. Taruh kode atau script dibawah ini berada dibawah </head> ingat copy kodenya dan pastekan dibawah </head> atau setelah </head>.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#related_posts{}
#related_posts h4{ border-top:1px solid #333; border-bottom:1px solid #333; color:#333; font-size:14px; letter-spacing:0; line-height:20px; margin:0 0 5px; padding:5px 10px; background:#03C}
#relpost_img_sum{/* height:320px; overflow:auto; */margin:0; padding:0px; line-height:16px}
#relpost_img_sum:hover{background:none}
#relpost_img_sum ul{list-style-type:none; margin:0; padding:0}
#relpost_img_sum li{border:1px solid #ccc; background:#fff; margin:0 0 5px; padding:5px; height:65px; list-style:none}
#relpost_img_sum .news-title{display:block; font-weight:bold !important}
#relpost_img_sum .news-text{display:block; text-align:justify; font-weight:normal; text-transform:none; color:#333}
#relpost_img_sum img{float:left; margin-right:5px; padding:4px; border:solid 1px #ccc; width:50px; height:50px; background:#fff}
</style>
<script type='text/javascript'>//<![CDATA[
var relnum = 0;
var relmaxposts = 5;

var numchars = 150;
var morelink = "selengkapnya";
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('2 4=f g();2 5=f g();2 9=f g();2 b=f g();s K(L,M){2 7=L.19("<");l(2 i=0;i<7.3;i++){8(7[i].N(">")!=-1){7[i]=7[i].O(7[i].N(">")+1,7[i].3)}}7=7.1a("");7=7.O(0,M-1);y 7}s 1b(z){l(2 i=0;i<z.P.6.3;i++){2 6=z.P.6[i];4[n]=6.A.$t;u="";8("Q"B 6){u=6.Q.$t}C 8("R"B 6){u=6.R.$t}9[n]=K(u,1c);8("S$T"B 6){D=6.S$T.1d}C{D="1e://1f.1g.1h/1i/1j/1k/1l/d/1m.1n"}b[n]=D;l(2 k=0;k<6.E.3;k++){8(6.E[k].U==\'1o\'){5[n]=6.E[k].v;F}}n++}}s V(a,e){l(2 j=0;j<a.3;j++)8(a[j]==e)y 1p;y 1q}s 1r(){2 m=f g(0);2 o=f g(0);2 p=f g(0);2 q=f g(0);l(2 i=0;i<5.3;i++){8(!V(m,5[i])){m.3+=1;m[m.3-1]=5[i];o.3+=1;o[o.3-1]=4[i];p.3+=1;p[p.3-1]=9[i];q.3+=1;q[q.3-1]=b[i]}}4=o;5=m;9=p;b=q;l(2 i=0;i<4.3;i++){2 c=w.W((4.3-1)*w.X());2 Y=4[i];2 Z=5[i];2 10=9[i];2 11=b[i];4[i]=4[c];5[i]=5[c];9[i]=9[c];b[i]=b[c];4[c]=Y;5[c]=Z;9[c]=10;b[c]=11}2 x=0;2 r=w.W((4.3-1)*w.X());2 12=r;2 h;2 13=14.1s;1t(x<15){8(5[r]!=13){h="<16 G=\'H-A 1u\'>";h+="<a v=\'"+5[r]+"\' U=\'1v\' I=\'J\' A=\'"+4[r]+"\'><1w 1x=\'"+b[r]+"\' /></a>";h+="<a v=\'"+5[r]+"\' I=\'J\'>"+4[r]+"</a>";h+="<17 G=\'H-18\'>"+9[r]+" ... <a v=\'"+5[r]+"\' I=\'J\'>"+1y+"</a><17 G=\'H-18\'>";h+="</16>";14.1z(h);x++;8(x==15){F}}8(r<4.3-1){r++}C{r=0}8(r==12){F}}}',62,98,'||var|length|reljudul|relurls|entry|cuplik|if|relcuplikan||relgambar|informasi|||new|Array|relhasil||||for|tmp|relnum|tmp2|tmp3|tmp4||function||postcontent|href|Math|rangkumanPosts|return|json|title|in|else|postimg|link|break|class|news|target|_top|saringtags|suchas|panjang|indexOf|substring|feed|content|summary|media|thumbnail|rel|contains|floor|random|tempJudul|tempUrls|tempCuplikan|tempGambar|rini|dirURL|document|relmaxposts|li|span|text|split|join|relpostimgthum|numchars|url|http|lh3|ggpht|com|_xcD4JK_dIjU|SnamIh0KTCI|AAAAAAAADMA|hLjqmEbdtkw|noimagethumb|gif|alternate|true|false|relatpost|URL|while|clearfix|nofollow|img|src|morelink|write'.split('|'),0,{}))
//]]></script>
</b:if>
Kita lihat diatas ada kode yang penulis warnai. Penulis akan jelaskan fungsinya pada bawah ini:
  1. var relmaxposts = 5; disitu maksudnya adalah jumlah artikel terkait yang akan Anda perlihatkan. Ubahlah sesuka anda. Mau 5, 15, 20, 50, terserah Anda.
  2. var numchars = 150; disitu maksudnya jumlah kalimat atau kata penjelas blog Anda. Atau bisa juga dikatakan kalimat pertama artikel blog Anda. Nah pada perihal ini penulis menulisnya 0. Karena bagi penulis judul saja sudah cukup keren.
  3. var morelink = "selengkapnya"; disitu maksudnya adalah link yang akan mengarahkan ke artikel blog Anda. Namun penulis hanya menulisnya "..." saja. Bagi penulis, blog itu indah karena simpelnya bukan ribetnya.
  4. Untuk mengotak-ngatik perihal lain silahkan otak atik dibawah kode </style>.
  • Langkah selanjutnya carilah kode atau script <data:post.body/> jika belum menemukan cobalah hanya dengan <data:post.body dengan pencarian Ctrl+F.
<data:post.body
  • Kemudian copy kode atau script yang terdapat pada dibawah ini dengan cara download disini. Ketika anda mencari <data:post.body/> ini nanti pasti akan menemukan dua atau tiga script dengan judul tersebut. Nah pastekan kode dibawah tepat setelah script yang nomor dua atau yang ketiga (terakhir). Kalau penulis pada yang ketiga atau yang terakhir menaruhnya.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related_posts' style='margin-top:35px;'>
<h4 style='color:#ffffff; text-shadow:none; border-radius:5px; border:2px solid #ddd; background:#6fa8dc;'>Artikel Terkait</h4>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgthum&amp;max-results=50&quot;' type='text/javascript'/>
</b:loop>
<ul id='relpost_img_sum'>
<script type='text/javascript'>relatpost();</script>
</ul>
</div>
</b:if>
Selesai sudah caranya. Untuk script yang penulis kasih warna tersebut silahkan bisa diganti sesuai kemauan. Bisa menjadi Artikel Terkait atau pun Related Post. Silahkan dirubah semaunya. Selamat mencoba.
.
Sumber:

Komentar