Cara Gampang Menciptakan Widget Random Post Responsive Di Blog

Cara Membuat, Menampilkan dan Memasang Widget Random Post Responsive di Blogger- Widget Random Post dalam suatu Website atau blog sangat penting sebagai Internal Link untuk memudahkan pengunjung mengakses banyak sekali artikel yang diperlukan. Random Posts arti dalam bahasa indonesia yakni Postingan Acak yang muncul secara Random dalam bentuk daftar list.

Baca juga: Cara Membuat Recent Post di Blog

Cara Membuat Random Post di Blog - Pada Website atau blog yang aku telusuri banyak sekali script random post yang sudah dibisa dipakai lagi melainkan sudah tidak aktif lagi. Makara disini aku akan membagikan script terbaru dari Random Post.

Sebelum memasangkan isyarat widget Random postnya dapat anda lihat demonya di samping blog aku ini.

Cara Memasang Widget Random Post di Blogger:

1. Pergi ke "Tata Letak" > "Add Widget / Tambahkan Widget" > Pilih "HTML/Javascript"

2. Isi terlebih dahulu Judul Widgetnya dengan "Random Posts" (Terserah anda)

3. Copy dan Paste isyarat script Random post di bawah ini dan Salin Kodenya ke Widget yang tadi.

<style scoped='' type="text/css">

#arlina-random ul{list-style:none;margin:0;padding:0}#arlina-random li{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #e3e3e3;word-break:break-word;padding:10px 0;margin:0;}

#arlina-random li:last-child{border-bottom:0;}

#arlina-random li a{color:#444;}#arlina-random li a:hover{color:#444;text-decoration:underline}

</style>

<div id='arlina-random'>Memuat...</div>

<script>

//<![CDATA[

// Random Post Widget

var homePage = 'http://www.indodominic.blogspot.com',

    maxResults = 10,

    containerId = 'arlina-random';

function getRandomInt(min, max) {

    return Math.floor(Math.random() * (max - min + 1)) + min;

}

function shuffleArray(arr) {

    var i = arr.length, j, temp;

    if (i === 0) return false;

    while (--i) {

        j = Math.floor(Math.random() * (i + 1));

        temp = arr[i];

        arr[i] = arr[j];

        arr[j] = temp;

    }

    return arr;

}

function ArlinaRandomPosts(json) {

    var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults));

    // console.log('Get the post feed start from ' + startIndex + ' until ' + (startIndex + maxResults));

    document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts"></scr' + 'ipt>');

}

function randomPosts(json) {

    var link, ct = document.getElementById(containerId),

        entry = shuffleArray(json.feed.entry),

        skeleton = "<ul>";

    for (var i = 0, len = entry.length; i < len; i++) {

        for (var j = 0, jen = entry[i].link.length; j < jen; j++) {

            link = (entry[i].link[j].rel == "alternate") ? entry[i].link[j].href : '#';

        }

        skeleton += '<li><a href="' + link + '">' + entry[i].title.$t + '</a></li>';

    }

    ct.innerHTML = skeleton + '</ul>';

}

document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=ArlinaRandomPosts"></scr' + 'ipt>');

//]]>

</script>

4. Ganti Warna Merah dengan Nama Blog anda dan Berapa Postingan yang ingin anda tampilkan di Random Postnya.

5. Jika sudah mengikuti tahap di atas, tinggal di save dan simpan template. Lihat Hasilnya :) Fast Loading dan Responsive.

Terima kasih sudah berkunjung ke artikel Cara Praktis Membuat Widget Random Post Responsive di Blogger. Jangan Lupa untuk berlangganan dengan kami dan di share ke teman-teman anda yang membutuhkannya.

Bagikan Artikel ini