Membuat Widget Random Post

Baca Juga

Kali ini aku akan menciptakan artikel wacana Cara Membuat Widget Random Post, untuk misalnya kalian dapat lihat menyerupai gambar diatas, untuk demonya tidak ada aku buat, tapi yang niscaya karenanya akan menyerupai gambar yang diatas tersebut,

Random Post

Buat kalian yang belum tau Widget Random Post,
Widget Random Post tersebut dipakai untuk menampilakn Artikel/Postingan kita yang lainnya secara acak,
bila Popular Post menampilkan Artikel yang paling sering dilihat, berbeda dengan Random Post, Karna hanya menampilkan postingan secara acak,
untuk cara membuatnya cukup mudah, cukup simak klarifikasi dibawah ini bro.

Widget Random Post

Login ke Blogger kalian, pilih Tata Letak/Layout > Tambah Gadget/Add Gadget > HTML/JavaScript
kemudian masukkan Script dibawah ini, kedalam Gadget tersebut.

 <style> #random-posts img {     float: left;     margin-right: 10px;     width: 65px;     height: 65px;     background-color: #F5F5F5;     padding: 3px; } ul#random-posts {    list-style-type: none;}  #random-posts li {     margin-bottom: 10px; }  .random-summary {     display: block; } </style>  <ul id='random-posts'> <script type='text/javaScript'> var randomposts_number = 5; var randomposts_chars = 60; var randomposts_details = 'yes'; randomposts_details2 = 'no'; var randomposts_comments = 'Comments'; var randomposts_commentsd = 'Comments Disabled'; var randomposts_current = []; var total_randomposts = 0; var randomposts_current = new Array(randomposts_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 i = 0; i < randomposts_number; i++) {         var found = false;         var rndValue = get_random();         for (var j = 0; j < randomposts_current.length; j++) {             if (randomposts_current[j] == rndValue) {                 found = true;                 break             }         };         if (found) {             i--         } else {             randomposts_current[i] = rndValue         }     } };  function get_random() {     var ranNum = 1 + Math.round(Math.random() * (total_randomposts - 1));     return ranNum }; </script> <script type='text/javaScript'> function random_posts(json) {     for (var i = 0; i < randomposts_number; i++) {         var entry = json.feed.entry[i];         var randompoststitle = entry.title.$t;         if ('content' in entry) {             var randompostsnippet = entry.content.$t         } else {             if ('summary' in entry) {                 var randompostsnippet = entry.summary.$t             } else {                 var randompostsnippet = "";             }         };         randompostsnippet = randompostsnippet.replace(/<[^>]*>/g, "");         if (randompostsnippet.length < randomposts_chars) {             var randomposts_snippet = randompostsnippet         } else {             randompostsnippet = randompostsnippet.substring(0, randomposts_chars);             var whitespace = randompostsnippet.lastIndexOf(" ");             randomposts_snippet = randompostsnippet.substring(0, whitespace) + "&#133;";         };         for (var j = 0; j < entry.link.length; j++) {             if ('thr$total' in entry) {                 var randomposts_commentsnum = entry.thr$total.$t + ' ' + randomposts_comments             } else {                 randomposts_commentsnum = randomposts_commentsd             }; if (entry.link[j].rel == 'alternate') {                 var randompostsurl = entry.link[j].href;                 var randomposts_date = entry.published.$t;                 if ('media$thumbnail' in entry) {                     var randompoststhumb = entry.media$thumbnail.url                 } else {                     randompoststhumb = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4APhtyI2PcNjRtYjMHRTRpRjUTNL22Jf7oQqvJvZ0Yd5RxQcFN0BiAzIS80dP7VudrKW_8Y8DimGOlHD7LcSnyHxiIHWG3JfvrQEMXHZ22xBqzzgKjTFBm5htlx2UVGuagNS-jX5IqSU/s1600/no_thumb.png"                 }             }         };         document.write('<li>');         document.write('<img alt=" Kali ini aku akan menciptakan artikel wacana  Membuat Widget Random Post" src="' + randompoststhumb + '"/>');         document.write('<div><a href="' + randompostsurl + '" rel="nofollow">' + randompoststitle + '</a></div>');         if (randomposts_details == 'yes') {            document.write('<span>' + randomposts_date.substring(8, 10) + '.' + randomposts_date.substring(5, 7) + '.' + randomposts_date.substring(0, 4) + ' - ' + randomposts_commentsnum) + '</span>'         }         if (randomposts_details2 == 'yes') {            document.write('<span class="random-summary">' + randomposts_snippet) + '</span>'         }         document.write('<div style="clear:both"></div></li>')     } };getvalue(); for (var i = 0; i < randomposts_number; i++) {    document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index=' + randomposts_current[i] + '&max-results=1&callback=random_posts\"><\/script>') }; </script> </ul> 

Dan Simpan/Save
dan lihat karenanya pada blog kalian,
untuk settingannya :

var randomposts_number = 5; ( Ganti Angka 5 Untuk menampilkan jumlah artikel yang diinginkan )
var randomposts_chars = 60; ( 60 Jumlah Karakter pada artikel )
var randomposts_details = 'yes'; ( 'yes' menampilkan detail artikel menyerupai tanggal atau comment, bila kalian tidak ingin menampilkannya ketik 'no' )

untuk tampilannya dapat kalian edit pada CSS tersebut.

Jika masih galau dengan klarifikasi saya, komen ae.