Cara Membuat Widget Random Post Keren Tanpa Gambar Di Blog

10:00:00
Cara Membuat Widget Random Post Tanpa Gambar Di Blog

Selamat datang agan atau aganwati kali ini saya akan berbagi tips tentang blogging yaitu cara membuat widget random post tanpa gambar di blog. Widget random post adalah widget yang ada pada blog yang menampilkan artikel-artikel yang diambil secara acak dari artikel blog kita. Memang widget random post belum disediakan oleh blogger sendiri. Tetapi kita dapat membuatnya sendiri dengan bantuan script-script dari pihak ketiga selain blogger.



Lalu apa fungsi widget random post sendiri pada blog kita? Sebenarnya banyak fungsi dan manfaat memasang widget random post tersebut antara lain dapat meningkatkan trafik artikel yang lain, dimana pengunjung yang penasaran dengan artikel yang ditampilkan pada widget random post pasti ia akan mengunjungi artikel tersebut, membuat pengunjung betah mengunjungi blog anda selama artikel yang anda buat sangat berbobot.



Nah berikut langkah-langkah membuat widget random post keren tanpa gambar di blog :

Langkah

1. Login pada blog anda masing-masing,

2. Pada menu dashboard blog pilih menu tata letak,

3. Setelah itu pilih menu tambahkan gadget, lalu pilih menu html / javascript,

4. Setelah itu akan muncul kolom html / javascript, copy script di bawah ini lalu paste pada kolom html / javascript yang sudah tersedia,

 <style scoped='' type="text/css">
#reways-random ul{list-style:none;margin:0;padding:0}#reways-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;}
#reways-random li:last-child{border-bottom:0;}
#reways-random li a{color:#444;}#reways-random li a:hover{color:#444;text-decoration:underline}
</style>
<div id='reways-random'>Memuat...</div>
<script>
//<![CDATA[
// Random Post Widget
var homePage = 'http://www.renaldyways.com',
    maxResults = 10,
    containerId = 'reways-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 rewaysRandomPosts(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=rewaysRandomPosts"></scr' + 'ipt>');
//]]>
</script> 



5. Setelah itu simpan.



Nah itu saja tentang artikel cara membuat widget random post keren tanpa gambar di blog, jangan lupa bagikan serta tinggalkan komentar anda terima kasih.



Referensi script : arlinadzgn.com

Share this

I'm CEO & Founder in http://caritema.com & http://renaldyways.blogspot.com/


Artikel Menarik Lainnya

Artikel Selanjutnya
Next Post
Artikel Sebelumnya
Previous Post
Cara style text di komentar Disqus dan Blogger:
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.
  • Untuk menggunakan emoji di bawah ini cukup copy kode tersebut dan beri jarak 1 spasi untuk menampilkan emoji pada kolom komentar Blogger.
Parser Kode
FAQ
Emotikon

Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger Emoticon Kaskus di Blogger
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

4 Comments

TeknoBagi 29 December 2016 at 13:05

Cakep nih widgetnya :D thx tutornya gan

Renaldy Ramadani 29 December 2016 at 22:18

yoi gan sama-sama :D

Chord Gitar 30 December 2016 at 03:00

Makasih, keren

Renaldy Ramadani 31 December 2016 at 10:18

sama-sama gan