Cara Membuat Related Post Premium

Cara Membuat Related Post Premium? Mengapa saya memberi judul diatas? Hehe, bukan bermaksud apa-apa, akan tetapi tutorial cara membuat related post premium yang disertai dengan thumbnail serta cuplikan / ringkasan ini memang sedikit sekali yang mengaplikasikannya.. Nah, kali ini yuk kita buat related post premium. Tutorial ini hanya berlaku pada mesin blogger.com alias blogspot.

Tutorial Membuat Related Post Premium

1. Masuk ke akun Blogger, Pilih Rancangan, kemudian Edit HTML.
2. Jangan lupa centang "Expand Template Widget".
3. Masukkan kode berikut ini sebelum kode </head>.

   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <style>
   #related_posts h4 {
   background: none repeat scroll 0 0 #333;
   color: #FFF;
   font-family: Arial,Tahoma,Verdana;
   font-size: 11px;
   font-weight: bold;
   margin: 0;
   padding: 2px 5px 1px 8px;
   text-shadow: 1px 1px #000000;
   text-transform: uppercase;
   }
   #relpost_img_sum {
   /* height: 320px;
   overflow: auto; */
   margin: 0;
   padding: 4px;
   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 #DDD;
   margin: 0;
   padding: 5px;
   height: 65px;
   list-style: none;
   }
   #relpost_img_sum li:hover {
   background-color: #E6E6E6;
   }
   #relpost_img_sum a {
   text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
   }
   #relpost_img_sum .news-title {
   display: block;
   font-weight: bold !important;
   margin-bottom: 4px;
   }
   #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: 14px;
   padding: 4px;
   border: solid 1px #DDD;
   width: 55px;
   height: 55px;
   }
   </style>
   <script type='text/javascript'>//<![CDATA[
   var relnojudul = 0;
   var relmaxtampil = 10;
   var numchars = 200;
   var morelink = "Baca 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|relnojudul|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|relmaxtampil|li|span|text|split|join|relpostimgcuplik|numchars|url|http|lh3|ggpht|com|_xcD4JK_dIjU|SnamIh0KTCI|AAAAAAAADMA|hLjqmEbdtkw|noimagethumb|gif|alternate|true|false|artikelterkait|URL|while|clearfix|nofollow|img|src|morelink|write'.split('|'),0,{}))
   //]]></script>
   </b:if>

4. Cari kode berikut <div class='post-footer'>, masukkan kode berikut ini dibawahnya.

   <b:if cond='data:blog.pageType == &quot;item&quot;'>
   <div id='related_posts'>
   <h4>Baca Juga:</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=relpostimgcuplik&amp;max-results=9&quot;' type='text/javascript'/>
   </b:loop>
   <ul id='relpost_img_sum'>
   <script type='text/javascript'>artikelterkait();</script>
   </ul>
   </div>
   </b:if>

5. Klik Simpan Template.

Oh iya, anda juga bisa menjumpai related post diatas pada blog ini yang terletak pada bagian bawah postingan ini. Cukup menarik dan premium bukan???
Semoga bermanfaat. :D