KODE IKLAN DFP 1 Simple Recent Posts Widget Untuk Blogspot (updated) | Masgunggoyo

Recents Posts

    Iklan Atas Artikel

    Simple Recent Posts Widget Untuk Blogspot (updated)

    KODE IKLAN 200x200
    KODE IKLAN 336x280
     Postingan kali ini adalah Updated dari sebelumnya Simple Recent Posts Widget Untuk Blogspot (updated)

    Postingan kali ini adalah Updated dari sebelumnya, masih ingat postingan sebelumnya yang pernah dibahas Cara Membuat Recent Post Blogger Menggunakan Peekaboo Effect nah postingan kali ini adalah updated lanjutannya yang akan kita modifikasi recent posts nya agar lebih simple dan tanpa menggunakan thumbnail, disini akan kita hapus beberapa kode script didalamnya yang nantinya hanya akan menampilkan link postingannya saja.

    Dipostingan yang lalu kita sudah menampilkan recent post dengan thumbnail yang kode scriptnya seperti dibawah ini

    function showlatestpostswiththumbs(json){document.write('<ul id="recent-posts-container">');for(var i=0;i<3;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commentstext=entry.link[k].title;var commentsurl=entry.link[k].href;} if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}} var recenthumb;try{recenthumb=entry.media$thumbnail.url;}catch(error){s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+ 5);d=s.substr(b+ 5,c- b- 5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){recenthumb=d;}else recenthumb='http://2.bp.blogspot.com/-C3Mo0iKKiSw/VGdK808U7rI/AAAAAAAAAmI/W7Ae_dsEVAE/s1600/no-thumb.png';} document.write('<li class="recent-posts-list">');document.write('<img class="recent-post-thumb" src="'+ recenthumb+'"/>');document.write('<div class="recent-post-title"><a href="'+ postsurl+'" target ="_top" title="Simple Recent Posts Widget Untuk Blogspot (updated)">'+ posttitle+'</a></div>');document.write('</li>');} document.write('</ul>');};function yScrollHandler(){var win=document.getElementById("peekaboo");if((window.pageYOffset+ window.innerHeight)>=document.body.offsetHeight){win.style.transition="right 0.7s ease-in-out 0s";win.style.right="0px";}else{win.style.transition="right 0.7s ease-in-out 0s";win.style.right="-452px";}};window.onscroll=yScrollHandler;

    Perhatikan kode yang ditandai, itu yang nantinya akan kita hapus dengan menghilangkan thumbnailnya, jadi lebih simple akan seperti ini jadinya.

    function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<6;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}} document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="Simple Recent Posts Widget Untuk Blogspot (updated)">'+ posttitle+'</a>');document.write('</li>');} document.write('</ul>');};

    Bagaimana sobat menjadi lebih sedikit dan simple kodenya, Bagaimana makin penasaran ? setelah itu silahkan sobat save kode dibawah ini di gadget HTML/Javascript pada sidebar melalui tata letak.

    <script> //<![CDATA[ function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<6;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}} document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="Simple Recent Posts Widget Untuk Blogspot (updated)">'+ posttitle+'</a>');document.write('</li>');} document.write('</ul>');}; document.write("<scr" + "ipt type=\"text/javascript\" src=\"/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts\"></scr" + "ipt>"); //]]> </script>

    Perhatikan kode 6 yang ditandai itu fungsinya untuk menampilkan banyaknya jumlah postingan yang akan sobat tampilkan di simple recent post.

    Lanjut lagi, silahkan sobat salin dan letakkan kode CSS dibawah ini tepat di atas kode </head>

    <style type='text/css'> #recent-posts{     width:auto;     padding:0 10px;     margin:0 auto;     border:1px solid #ddd; } #recent-posts ul,#recent-posts li {     list-style:none; } #recent-posts a{     text-decoration:none; } #recent-posts li{     border-top:1px solid #ddd;     padding:6px 0 } #recent-posts li:first-child{     border-top:none; } </style>

    RESULT

    Dan selesai, Selamat Mencoba

    Sumber https://www.dibalikseo.com
    KODE IKLAN 300x 250
    close
    ==[ Klik disini 1X ] [ Close ]==
    KODE IKLAN DFP 2
    KODE IKLAN DFP 2