Cara Membuat Widget Random Post kren Pada Blog terbaru 2016

Cara Membuat Widget Random Post Pada Blog

contohnya seperti di bawah ini

Untuk Membuat Random Post kali ini saya akan memakai kode script jquery, dimana tampilan Widget akan terlihat semakin menarik. Postingan akan muncul secara acak dengan gambar thumb yang bergerak dari atas kebawah secara bergantian.

Widget Random Post ini tentu tidak akan memberatkan loading pada blog, kalau sahabat penasaran dengan Widget Random Post ini silahkan sahabat bisa melihat demonya dibawah ini :

DEMO

Nah sekarang bagi sahabat yang ingin Membuat Widget Random Post Pada Blog, silahkan sahabat lakukan langkah berikut ini :

1. Login ke Blogger

2. Pilih Tata Letak

3. Selanjutnya tambahkan Widget baru dengan meng-klick "Add Gadget"

4. Pilih HTML/Javascript

5. Copy kode script dibawah ini dan pastekan kedalam Widget tersebut

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><center><strong>RANDOM POST</strong></center>
<center>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:1px;
padding:0px 0px;
height:300px;
}
#spylist ul{
width:100%;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:100%;
padding: 0px 0px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url() repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
width:100%;
font-size:10px;
height:12px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:8px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:12px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:8px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "https://lh4.googleusercontent.com/-zmvEs7dtp3U/T9L0Ke6YvXI/AAAAAAAAA0k/5xApt7ciJwU/s128/logo.png";
imgr[1] = "https://lh4.googleusercontent.com/-zmvEs7dtp3U/T9L0Ke6YvXI/AAAAAAAAA0k/5xApt7ciJwU/s128/logo.png";
imgr[2] = "https://lh4.googleusercontent.com/-zmvEs7dtp3U/T9L0Ke6YvXI/AAAAAAAAA0k/5xApt7ciJwU/s128/logo.png";
imgr[3] = "https://lh4.googleusercontent.com/-zmvEs7dtp3U/T9L0Ke6YvXI/AAAAAAAAA0k/5xApt7ciJwU/s128/logo.png";
imgr[4] = "https://lh4.googleusercontent.com/-zmvEs7dtp3U/T9L0Ke6YvXI/AAAAAAAAA0k/5xApt7ciJwU/s128/logo.png";
showRandomImg = true;
boxwidth = 200;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 50;
thumbheight = 50;
fntsize = 9;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 100;
home_page = "http://www.nurhidayatnr.blogspot.co.id/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://sundaboy.googlecode.com/files/Artikel%20Terkait%20berkedip.txt' type='text/javascript'></script>
</div></center>

6. Keterangan
- RANDOM POST = Judul Widget Random Post
- height:300px; = Tinggi Widget
- width:100%; = Lebar Widget ( 100% akan menyesuaikan secara otomatis dengan ukuran Widget)
- numposts = 100; = Jumlah Postingan yang akan di munculkan

7. Ganti url http://www.nurhidayatnr.blogspot.co.id/ dengan url milik sahabat.

8. Simpan dan lihatlah hasilnya

Nah itulah Cara Membuat Widget Random Post Pada Blog yang dapat saya share, semoga bermanfaat, kalau ada kesulitan silahkan untuk berkomentar pada kotak komentar dibawah ini. sekian dan terimakasih