Cara Buat "Related Post" v6

Membuat Related Post v6 Ini Nampak Agak Ketara Dengan Fungsi 2 kolum Besertakan Dengan Setenggah Artikel Posting Anda,Membuatkan Related Post Ini Memudahkan Pembaca Blog Anda.


1.Login Ke Blogger
2.Template’ > ‘Edit HTML > PROCEED > Expand Widget Templates
3.Cari kode </head>
4.Copy Kode Dibawah Dan Pastekan Diatas Kode </head>

                                                                                                                                                             <b:if cond='data:blog.pageType != &quot;index&quot;'>
<style type='text/css'>
@font-face {font-family: &#39;Arial&#39;;
font-style: normal;
font-weight: 400;
src: local(&#39;Arial&#39;), local(&#39;Arial&#39;), url(&#39;http://themes.googleusercontent.com/static/fonts/federant/v4/C109bUmZeyhh-vIXq9lNfvesZW2xOQ-xsNqO47m55DA.woff&#39;) format(&#39;woff&#39;);
}
Paste the CSS source code you want to compress here#post-related {
width:100%;
margin-left:11px
}
#post-related p {
font-family:Federant;
font-size:14px;
margin:10px auto 0px
}
.reltit {
color:#333;
font-family:Arial,Tahoma,Verdana;
font-size:16px;
font-weight:700;
text-shadow:1px 1px #eee;
text-transform:uppercase;
text-align:center;
margin:5px 0 0;
padding:5px 0
}
#ar-related {
line-height:16px;
margin:0;
padding:5px 0
}
#ar-related ul {
list-style-type:none;
margin:0;
padding:0
}
#ar-related li {
width:46%;
float:left;
list-style:none;
border:1px solid #D3D3D3!important;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
-moz-box-shadow:1px 1px 2px #CCC inset;
height:145px;
margin:0 3px;
padding:5px
}
#ar-related li:hover {
background-color:#f9f9f9
}
#ar-related a {
text-shadow:0 1px 1px #aaa;
color:#5D73B5;
font-family:Federant
}
#ar-related .news-title {
margin-bottom:5px;
display:block;
font-size:14px;
text-align:left
}
#ar-related .news-text {
font-family:Rockwell;
display:block;
font-size:12px;
text-align:justify;
font-weight:400;
text-transform:none;
color:#333
}
#ar-related img {
float:left;
margin-right:5px;
width:70px;
height:70px;
border:1px solid #D3D3D3!important;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
-moz-box-shadow:1px 1px 2px #CCC inset;
padding:4px
}
</style>
<script type='text/javascript'>
SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/2.1.364/scripts/clipboard.swf&#39;;
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.config.stripBrs = true;
SyntaxHighlighter.all();
</script>
<script type='text/javascript'>//<![CDATA[
var relnojudul = 0;
var relmaxtampil = 10;
var numchars = 200;
var morelink = "Readmore ...";
/**/
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|bcrelated|URL|while|clearfix|nofollow|img|src|morelink|write'.split('|'),0,{}))
//]]></script>
</b:if>

5.Copy Kode Dibawah Dan Pastekan Dibawah Kode <data:post.body/>

                                                                                                                                                                           <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='post-related'>
<p class='reltit'>Baca Artikel Lainnya :</p>
&lt;script src=&#39;/feeds/posts/default/-/tutorial%20blog?alt=json-in-script&amp;callback=relpostimgcuplik&amp;max-results=50&#39; type=&#39;text/javascript&#39;&gt;&lt;/script&gt;
<ul id='ar-related'>
<script type='text/javascript'>bcrelated();</script>
</ul>
</div>
</b:if>

6.Jika Kode <data:post.body/> Lebih Dari 1,Letakan Pada Kode Yang Ke2
7.Jika Tidak Berfungsi Letakan Dibawah Kode <div class='post-footer-line post-footer-line-1'> Atau Kode Ini <div style='clear: both;'/> <!-- clear for photos floats -->
8.Jika Anda Inigin Mengedit
- var relmaxtampil = 10;
- var numchars = 200
- Readmore
- Baca Artikel Lainnya
- tutorial%20blog

Siap!!! Sila Kongsi Artikel Ini Dengan Kawan2 Anda,Berkongsi Itu Indah!!! Klik Butang Dibawah.