Widget Random Post Cepat Dan Valid HTML5

Widget Random Post Cepat Dan Valid HTML5 - Widget Random Post merupakan widget yang sangat berguna untuk meampilkan artikel blog secara acak. Widget ini mampu menampilkan artikel lama yang mungkin belum terpublish dengan baik, akan tetapi kebanyakan widget random post cukup berat dibuka pada peramban karena widget ini akan memanggil feed posting yang berukuran sangat besar, lalu akan ditampilkan secara acak.

<script src='/feeds/posts/default?alt=json-in-script&max-results=99999&callback=randomPosts'></script>

Pada teks yang diblok kuning merupakan feed yang dipanggil 99999 artikel, walaupun artikel yang akan ditampilkan cuma beberapa saja. Sangat boros tenaga bukan?

Nah disini saya akan berbagi widget random post cepat dan valid HTML5 yang merupakan kreasi mas Taufik Nurrohman salah satu blogger jagoan indonesia.

> Tambahkan widget baru pada Tata Letak.

<div id='random-post-container'>Memuat...</div>
<script>
//<![CDATA[
// Feed configuration
var homePage = 'http://nama_blog.blogspot.com',
    maxResults = 7,
    containerId = 'random-post-container';
// Function to generate random number limited from `min` to `max`
// Used to create a valid and safe random feed `start-index`
function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
// Function to shuffle arrays
// Used to randomize order of the generated JSON feed
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;
}
// Get a random start index
function createRandomPostsStartIndex(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>');
}
// Widget's main function
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=createRandomPostsStartIndex"></scr' + 'ipt>');
//]]>
</script>

Catatan : > Ganti dengan url blog sobat http://nama_blog.blogspot.com
              > Artikel yang akan ditampilkan 7
Untuk demonya bisaa dilihat pada sidebar blog ini, sekian dan semoga bermanfaat.

Sumber : http://www.dte.web.id/2013/06/performa-widget-random-post.html