Gadget Random Post seperti yang tampil di sebelah kanan blog ini selain berguna untuk mempercantik blog juga berfungsi menampilkan posting secara acak, tidak hanya artikel baru saja tapi yang lama juga bisa muncul pada side bar
Caranya membuatnya tidak sulit. Hanya dengan beberapa langkah maka Gadged Random Post siap menyedot perhatian pengunjung untuk berlama-lama nongkrong membaca artikel baru maupun artikel lama yang ada di blog kita.
Cara membuat Gadged Random Post dengan Thumbnail :
- Dari Dashboard Blogger
- Masuk ke layout
- Add Gadget
- Pilih HTML/Java Script
- Copy kode di bawah
- Paste kode ke dalam Gadget HTML
<style> #bo-random-posts img { background: #cccccc; height: 72px; float: left; width: 72px; margin: 5px 5px 4px 4px; padding: 1px; } #bo-random-posts img:hover { opacity: 0.5; filter: alpha(opacity=50); } ul#bo-random-posts { list-style-type: none; margin-left: 3px; margin-right: 3px; background: #333333; background-repeat: no-repeat; } #bo-random-posts li { margin: 10px 0; border-bottom: 1px solid #808000; } #bo-random-posts li a { padding: 5px 0; color: #f69402; text-decoration: none; } .bo-random-summary { display: block; } </style> <ul id='bo-random-posts'> <script> var borp_number = 8; var borp_details = 'yes'; var borp_chars = 60; var borp_details2 = 'yes'; var borp_comments = 'Comments'; var borp_commentsd = 'Comments Disabled'; var borp_current = []; var total_randomposts = 0; var borp_current = new Array(borp_number); function randomposts(json) { total_randomposts = json.feed.openSearch$totalResults.$t; } document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>'); function getvalue() { for(var r=0;r<borp_number;r++){for(var n=!1,o=get_random(),t=0;t<borp_current.length;t++)if(borp_current[t]==o){n=!0;break; } n?r--:borp_current[r]=o; }} function get_random() { return 1+Math.round(Math.random()*(total_randomposts-1)); } </script> <script>function random_posts(t) { for(var e=0;e<borp_number;e++){var r=t.feed.entry[e],s=r.title.$t;if("content"in r)i=r.content.$t;else if("summary"in r)i=r.summary.$t;else var i="";if((i=i.replace(/<[^>]*>/g,"")).length<borp_chars)var a=i;else{var n=(i=i.substring(0,borp_chars)).lastIndexOf(" ");a=i.substring(0,n)+"…"; } for(var o=0;o<r.link.length;o++) { if("thr$total"in r)var l=r.thr$total.$t+" "+borp_comments;else l=borp_commentsd;if("alternate"==r.link[o].rel){var m=r.link[o].href,c=r.published.$t;if("media$thumbnail"in r)var u=r.media$thumbnail.url;else u="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgapLQyJfgzBSENpJLBoE36mqR7LRDOX-F4_yS-Fpv9cHHooENgVqHGlcEngDfKfVDzoKU7M3-dEjOUylDE3gBC0ABas3D3FFxKyIjk7cXFFsIsR_wywpYgbECS0D2nlcWAzF-F_GJLgt12/s1600/no_thumb.png"; }} document.write("<li>"),document.write('<img alt="'+s+'" src="'+u+'"/>'),document.write('<div><a href="'+m+'" rel="nofollow">'+s+"</a></div>"),"yes"==borp_details&&document.write("<span>"+c.substring(8,10)+"."+c.substring(5,7)+"."+c.substring(0,4)+" - "+l),"yes"==borp_details2&&document.write('<span class="random-summary">'+a),document.write('<div style="clear:both"></div></li>'); }} getvalue();for(var i=0;i<borp_number;i++)document.write('<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index='+borp_current[i]+'&max-results=1&callback=random_posts"><\/script>');</script> </ul> |
Keterangan :
- background: #cccccc - Warna Background Thumbnail
- background: #333333 - Warna Background Gadged
- padding ... color: f69402 - Warna Judul
- var borp_number = 8 - Jumlah Post Yang ditampilkan
- var borp_details = 'yes' - Untuk Menampilkan Text Judul
- var borp_details2 = 'yes' - Untuk menampilkan Deskripsi
Dengan memasang kode di atas nantinya yang akan tampil di sidebar tidak hanya teks seperti pada gadget standar artikel terbaru, pada random post ini akan ditambah thumbnail atau gambar kecil yang tentu saja bisa jadi lebih keren.
- Thank You for Visiting my Blog - |
