-->






Cara membuat artikel terkait disertai gambar

Blogger wonogiri kali ini akan berbagi tentang cara membuat artikel terkait yang muncul langsung di bawah postingan
Artikel terkait adalah suatu fitur blogger yang otomatis akan memberikan cuplikan posting yang lainya yang masih ada kaitanya dengan posting yang sedang di buka
Artikel Terkait banyak ragam versinya hanya artikel terkait dengan postingan saja, atau artikel terkait hanya dengan gambar

pada panduan blogger wonogiri kali ini akan menyajikan cara membuat artikel terkait di sertai gambar , contoh dari artikel terkait di sertai dengan gambar dan cuplikan postingya seperti pada gambar di bawah ini

cara membuat artikel terkait disertai gambar
Fungsi Artikel Terkait

  • memberitahukan kepada pengunjung posting yang lainya yang masih ada hubunganya dengan artikel yang sedang di bacanya
  • memberikan kemudahan pada pengguna untuk menelusuri konten yang sedang di bacanya
  • mempromosikan posting sendiri supaya cepet di ketahui oleh pengguna

    Cara membuat artikel terkait dengan gambar 
    1.buka blog anda www.blogger.com 
    2.lalu login 
    3.pada menu dashboard blog pilih Template 
    4.lalu klik edit Html
    5.kopi kode di bawah ini dan pastekan di atas kode </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>


    6.kopi lagi kode di bawah ini dan pastekan di bawah kode ini <!-- clear for photos floats --> , atau pastekan di bawah / di akir rangkaian kode ini <div id='share-button'>

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

    7.selanjuntnya simpan template anda
    8.selesai

    jika mengikuti langkah pembuatan artikel terkait dengan gambar di atas saya yakin sobat bloggerwan dan bloggerwati akan berhasil membuat artikel terkait ddengan gambar
    jika ada kesulitan silahkan berkomentar saja , malu bertanya tidak akan sampai rumah kekasih
    Blogger wonogiri
    Komentar

    Tampilkan

    No comments:

    Post a Comment

    sejarah

    +