Latest News

Cara Membuat Artikel Terkait/Related Post Keren Di Blogger

Artikel terkait merupakan widget yang penting. Terutama untuk menurunkan bounce rate/rasio pentalan blog anda. Rasio pentalan ini menunjukkan seberapa betahkah pengunjung berada di blog anda,dengan menunjukkan artikel lain yang sesuai maka mampu meningkatkan lamanya pengunjung di blog kita sehingga menurunkan rasio pentalan situs kita. Maka dari itulah widget related post ini harus dipasang.

Selain itu mampu meningkatkan page views blog kita. Mungkin kalian pernah melihat related post dari google. Biasanya ada logo menyerupai iklan adsense dipojok kanan atas. Itu namanya matched content. Seperti halnya related post yang berfungsi untuk meningkatkan page views dan menurunkan bounce rate,matched content ini mampu meningkatkan penghasilan dengan adanya iklan didalamnya. Tapi kita tidak akan membahas lebih dalam perihal matched content.

Dengan memasang related post atau artikel terkait maka mampu menurunkan bounce rate blog kita. Matched content salah satu pola related post dari google. Yuk pasang related post.

Related post ini mampu anda letakkan dimana saja. Di sidebar/footer tapi idealnya lebih bagusnya kita pasang di bawah postingan artikel kita. Ketika pengunjung final membaca artikel maka mampu melihat widget artikel terkait dan mampu membaca artikel yang lain. Bagaimana cara membuatnya? Berikut langkah-langkahnya

Cara Memasang Related Post

Langkah 1
Silakan masuk ke blogger,pilih Template → Edit HTML. Salin isyarat css dibawah ini dan letakkan diatas isyarat ]]></b:skin> atau </style>

/* Arlina Related Post */ #related_posts{margin-top:20px} #related_posts h4{color:#fff;background:#3498db;padding:10px;margin:0 0 5px;font-size:110%;} #related_img{margin:0;padding:0;} #related_img:hover{background:0} #related_img ul{list-style-type:none;margin:0;padding:0} #related_img li{min-height:62px;border-bottom:1px solid #f1f1f1;list-style:none;margin:0 0 5px;padding:5px;} #related_img li a{color:#2672a0;} #related_img li a:hover{text-decoration:underline} #related_img .news-title{display:block;font-weight:bold!important;margin-bottom:5px;font-size:14px;} #related_img .news-text{display:block;font-weight:normal;text-transform:none;color:#888;font-size:11px;} #related_img img{float:left;margin-right:10px;width:60px;height:60px;max-width:100%;background:#fff}

Langkah 2
Salin isyarat dibawah ini dan pastekan/letakkan diatas isyarat </head>

<script type='text/javascript'>/*<![CDATA[*/var relnum=0;var relmaxposts=5;var numchars=135;var morelink=" ";function saringtags(r,l){for(var e=r.split("<"),n=0;n<e.length;n++)-1!=e[n].indexOf(">")&&(e[n]=e[n].substring(e[n].indexOf(">")+1,e[n].length));return e=e.join(""),e=e.substring(0,l-1)}function relpostimgthum(r){for(var l=0;l<r.feed.entry.length;l++){var e=r.feed.entry[l];reljudul[relnum]=e.title.$t,postcontent="","content"in e?postcontent=e.content.$t:"summary"in e&&(postcontent=e.summary.$t),relcuplikan[relnum]=saringtags(postcontent,numchars),postimg="media$thumbnail"in e?e.media$thumbnail.url:"http://lh3.ggpht.com/_xcD4JK_dIjU/SnamIh0KTCI/AAAAAAAADMA/hLjqmEbdtkw/d/noimagethumb.gif",relgambar[relnum]=postimg;for(var n=0;n<e.link.length;n++)if("alternate"==e.link[n].rel){relurls[relnum]=e.link[n].href;break}relnum++}}function contains(r,l){for(var e=0;e<r.length;e++)if(r[e]==l)return!0;return!1}function relatpost(){for(var r=new Array(0),l=new Array(0),e=new Array(0),n=new Array(0),t=0;t<relurls.length;t++)contains(r,relurls[t])||(r.length+=1,r[r.length-1]=relurls[t],l.length+=1,l[l.length-1]=reljudul[t],e.length+=1,e[e.length-1]=relcuplikan[t],n.length+=1,n[n.length-1]=relgambar[t]);reljudul=l,relurls=r,relcuplikan=e,relgambar=n;for(var t=0;t<reljudul.length;t++){var a=Math.floor((reljudul.length-1)*Math.random()),u=reljudul[t],s=relurls[t],i=relcuplikan[t],o=relgambar[t];reljudul[t]=reljudul[a],relurls[t]=relurls[a],relcuplikan[t]=relcuplikan[a],relgambar[t]=relgambar[a],reljudul[a]=u,relurls[a]=s,relcuplikan[a]=i,relgambar[a]=o}for(var g,m=0,h=Math.floor((reljudul.length-1)*Math.random()),c=h,d=document.URL;m<relmaxposts&&(relurls[h]==d||(g="<li class='news-title clearfix'>",g+="<a href='"+relurls[h]+"' rel='nofollow' target='_top' title='"+reljudul[h]+"'><img src='"+relgambar[h]+"' /></a>",g+="<a href='"+relurls[h]+"' target='_top'>"+reljudul[h]+"</a>",g+="<span class='news-text'>"+relcuplikan[h]+" ... <a href='"+relurls[h]+"' target='_top'>"+morelink+"</a><span class='news-text'>",g+="</li>",document.write(g),m++,m!=relmaxposts))&&(h<reljudul.length-1?h++:h=0,h!=c););}var reljudul=new Array,relurls=new Array,relcuplikan=new Array,relgambar=new Array;/*]]>*/</script>

Langkah 3
Salin isyarat berikut dan letakkan dibawah isyarat <data:post.body/>

<div id='related_posts'> <h4>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='related_img'> <script type='text/javascript'>relatpost();</script> </ul> </div>

Karena kode <data:post.body/> ada lebih dari satu ditemplate maka silakan anda cocokan/coba satu per satu.

Lalu simpan template.

Sekarang coba buka blog sahabat dan lihat apakah artikel terkaitnya udah muncul atau belum dibawah postingan. Cukup sekian artikel yang mampu aku bagikan. Semoga mampu membantu dan bermanfaat.