Widget Random Post Super Cepat 2016






Random post kali ini sangat berbeda sekali dengan random post - random post yang pada umumnya karena random post yang akan kita bahas adalah random post yang menerapkan random number terlebih dahulu baru kemudian number hasil random tersebut diterapkan pada start-index pada feed json blogspot yang akan di panggil. Jadi tidak langsung semua feed blog diload sekaligus seperti random post pada umumnya yang tentu saja sangat membebani kinerja blog itu sendiri, selain meloading kontent utama juga dibebani oleh loading feed yang terdiri dari beberapa ratus posting sekaligus.

Oleh karena itu dengan hanya meloading feed dari start-index yang ditentukan maka hanya beberapa post yang akan diload sekaligus sesuai post yang akan dirandom pada settingan scriptnya nanti dan otomatis loading blog menjadi lebih ringan.

Langsung aja ada scriptnya smoga bisa di fahami :

<style>

div.imgs {
    margin: 2px;
    border: 1px solid #ccc;
    float: left;
    width: 72px;
}

div.imgs:hover {
    border: 1px solid #777;
}

div.imgs img {
    width: 100%;
    height: auto;
}

div.desc {
    padding: 5px;
    text-align: center;
    font-size:small;
}

</style>

<div id='random-post-container'>Loading...</div>

<script>
//<![CDATA[
// Feed configuration
var homePage = 'http://www-gunbat-music.blogspot.com',
    maxResults = 6,
    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 = "";
    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 : '#';
if("media$thumbnail" in entry[i]){var image = entry[i].media$thumbnail.url}else{image="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg67tj7PIIMHgygdPTL18T8Zt65EH45-AjnUrUoH3iDMxeODm2SSgiV993Iisq6Mn922AhdORvNk9lzM1JczgVfM6_YtO-47ShLLqPuCIi8wtSf-ncq8hKNhEF59L7lxSDkDxXrZ7FJoZ4/s1600/no_image.jpg"}
        }
        title = entry[i].title.$t;
        skeleton += '<div class="imgs"><a target="_self" href="'+link+'"><img src="'+image+'" alt="'+title+'" width="300" height="200" title="'+title+'"></a><div class="desc">'+title.substring(0,8)+'..</div></div>';
    }
    ct.innerHTML = skeleton + '';
}
document.write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex"></scr' + 'ipt>');
//]]>
</script>


Silahkan dinikmati....
Previous
Next Post »