Cara Membuat Artikel Terkait Keren Vertikal Di Blogger

Cara Membuat Artikel Terkait Keren Vertikal Di Blogger - Assalamualaikum wr.wb, kali ini kita akan membahas mengenai cara menciptakan artikel terkait dengan style vertikal dan keren, untuk dipasang di blog sobat.

Manfaat dengan menambahkan Artikel Terkait di blog teman sangat banyak, selain sebagai interlink antara artikel di blog juga sebagai sajian navigasi artikel yang akan menampilkan posting yang terkait sehingga memudahkan pengunjung dalam menjalajahi blog Anda. Selain itu juga Artikel Terkait sanggup meningkatkan kemudian lintas di blog Anda dan mengurangi tingkat bouncing di blog sehingga hal ini akan menjadi nilai plus buat blog Anda. 

Langkah-langkah Membuat Widget Artikel Terkait :

Langkah 1 : Pergi ke Template, kemudian Edit Template.

Langkah 2 : Cari instruksi </head> , Ctrl+F untuk mempermudah pencarian.

Langkah 3 : Salin instruksi berikut, diatas instruksi </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>

Langkah 4 : Lalu cari instruksi <data:post.body/>

Langkah 5 : Kemudian salin instruksi berikut ini di bawah instruksi <data:post.body/> , biasanya instruksi ini ada 1-3 di template sobat, pilihlah diantara instruksi 2-3

<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>  

Langkah Terakhir : Simpan Template.

Sekian tutorial aku hari ini, agar Cara Membuat Artikel Terkait Keren Vertikal Di Blogger bermanfaat bagi teman semua, postingan ini, aku sanggup dari satu-delapan.blogspot.com, jikalau ada kekurangan aku mohon maaf, Wassalam.

Tweet

Subscribe to receive free email updates: