Cara Membuat Widget Random Post Dengan Thumbnail di Blogspot

Widget random post untuk blogger dapat menurunkan tingkat bouncing untuk sebuah blog, selain itu juga, itu dapat meningkatkan keterlibatan pengguna dengan menampilkan beberapa postingan secara acak ke pengunjung kamu. Dengan menggunakan widget posting acak di blog , kamu dapat memberikan pembaca dan pengunjung blog kebebasan untuk menavigasi blog  lebih efisien seperti widget kotak pencarian.

Pada kenyataannya, sebuah widget random post bisa menampilkan postingan blog lama hidup dengan membawa mereka kembali di depan audiens. Selain itu, kamu akan mengumpulkan beberapa tampilan halaman tambahan dan tarik-menarik pembaca juga, luar biasa untuk meningkatkan nilai dari blog kamu.

Tampilan widgetnya kira-kira akan seperti gambar berikut ini, kamu bisa edit codenya sesuai dengan selera dan kebutuhan kamu.

Cara Membuat Widget Random Post Dengan Thumbnail di Blogspot
Sumber : Dok. Pribadi

Sebenarnya, widget random post ini dirancang khusus untuk sidebar blog kamu. Hal penting lainnya adalah, widget ini responsif sehingga widget ini akan beradaptasi dengan lebar sidebar blog kamu secara otomatis.

Cara Membuat Widget Rndom Post Dengan Thumbnail di Blogspot

Langkah pertama, silahkan login ke akun blogspot kamu, kemudian navigasi ke tab sebelah kiri pilih Layout->Add Gadget->Pilih HTML/JavaScript, untuk lebih jelas, perhatikan gambar berikut.
Cara Membuat Widget Random Post Dengan Thumbnail
Sumber : Dok. Pribadi
Code Widget Random Post Blogspot

<style> #bo-random-posts img{background:#fff;height:50px;float:left;width:50px;margin:5px 5px 0px 0px;-webkit-border-radius:50%;border-radius:50%;-moz-border-radius:50%;padding:3px;} #bo-random-posts img:hover{opacity: 0.5;filter: alpha(opacity=50);} #bo-random-posts li {margin: 10px 0;} #bo-random-posts li a{padding: 5px 0;text-decoration: none;} .bo-random-summary {display: block;} </style> <ul id=’bo-random-posts’> <script> var borp_number = 5; var borp_details = ‘yes’; var borp_chars = 60; var borp_details2 = ‘no’; 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)+”&#133;”}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://4.bp.blogspot.com/-atF9AaH_YEI/WXc5HKoFZmI/AAAAAAAAAGE/LoIPxdwBHecNVesXy9J0AQJwdIuWFYu0QCLcBGAs/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> <a style=”font-size: 9px; color: #CECECE;margin-top:10px;” href=”http://www.bangpahmi.com/2017/12/cara-membuat-widget-random-post-di-blogspot.html” rel=”dofollow”>Random Posts Widget</a>

Copy script yang ada diatas lalu pastekan code tersebut ke kolom kedua yang tersedia lalu klik Save. Untuk lebih jelas perhatikan gambar berikut.
Cara Membuat Widget Random Post Dengan Thumbnail di Blogspot
Sumber : Dok. Pribadi
Itulah sedikit informasi yang bisa saya bagikan tentang cara membuat widget random post di blogspot, selamat mencoba dan semoag berhasil ya. Jangan sungkan untuk tinggalkan jejak di kolom komentar jika kamu mengalami kesulitan.
Komentar Terbaru