Cara Membuat Tombol Surprise Me (Random Post) Di Blog

Cara Membuat Tombol Surprise Me (Random Post) Di Blog

Kali ini saya akan berbagi kepada kalian sebuah tutrial tentang bagaimana caranya membuat tombol atau link random post atau yang lebih dikenal dengan surprise me. Ketika kalian menekan tonbol tersebut, secara otomatis akan diarahkan ke sebuah postingan secara acak. Jika kalian belum mengerti, kalian bisa melihat contohnya di link di bawah ini :


Bagaimana? Kalian tertarik? Langsung saja. Berikut ini adalah cara membuatnya :

  • Pertama, masuk ke dasboard blog kalian.
  • Masuk ke Template.
  • Pilih Edit HTML.
  • Masukkan kode JavaScript di bawah ini tepat di atas kode </body> :

 <script type='text/javascript'>
//<![CDATA[
function showLucky(root){
    var feed = root.feed;
    var entries = feed.entry || [];
    var entry = feed.entry[0];
      for (var j = 0; j < entry.link.length; ++j) {
       if (entry.link[j].rel == "alternate") { 
       window.location = entry.link[j].href; 
       } 
      } 
   }
function fetchLuck(luck){
    script = document.createElement('script');
    script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky';
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
   }
function readLucky(root){
    var feed = root.feed;
    var total = parseInt(feed.openSearch$totalResults.$t,10);
    var luckyNumber = Math.floor(Math.random()*total);
    luckyNumber++;
    fetchLuck(luckyNumber);
    }
function feelingLucky(){
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = '/feeds/posts/summary?max-results=0&alt=json-in-script&callback=readLucky';
    document.getElementsByTagName('head')[0].appendChild(script);
    }
//]]>
</script> 
  • Simpan perubahan Templatenya.
Untuk menggunakannya, kalian hanya perlu menambahkan kode di bawah ini di menu blog kalian :
<li class='ranpost'><a onclick='feelingLucky();'><i/>Random Post</a></li>
Saya mendapatkan tutorial ini dari idblanter.com. Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa untuk meninggalkan komentar dan klik tombol like di bawah ini. 

4 Responses to "Cara Membuat Tombol Surprise Me (Random Post) Di Blog"

  1. Wah, dulu pernah buka web yang ada linknya seperti ini.. Saya inginmembuatnya.. Saya cari caranya teteapi tidak ketemu.. Dan ternyata di sini ada caranya..

    ReplyDelete
  2. Nice gan!!!!
    udah coba ane pasang nih di BLOG ane,,,

    ReplyDelete