Membuat Widget Artikel Terbaru Slider di Blog

Membuat Widget Artikel Terbaru Slider di BlogTULISKAN.com - Widget Artikel Terbaru adalah widget yang menampilkan artikel-artikel yang baru terbit di suatu blog, jadi sederhananya widget artikel ini menampilkan artikel berdasarkan frekuensi terbitnya, semakin baru terbit maka semakin diatas munculnya. Selain itu, didukung dengan fitur slider atau slide show kebawah widget ini juga membuat interface atau antarmuka lebih menarik, serta menghemat space yang tersedia di blog, karena bersifat slider.

Cara Membuat Widget Artikel Terbaru Slider di Blog

1. Login ke Blogger.

2. Pilih tata Letak.

3. Klik "Add widget'

4. lalu pilih widget "HTML/JavaScript"

5. Letakkan kode script di bawah ini kedalamnya.

<style type="text/css">
#spylist {overflow:auto;height:300px;margin-top:5px;padding:0px 0px;} 
#spylist ul{list-style-type: none;padding:0px;margin:0px;} 
#spylist li {padding: 5px 0px 5px 5px;margin:0px;float:none;height:44px;} 
#spylist li a {text-decoration:none;color:#4B545B;font:12px calibri;margin:0px;padding:0px;} 
#spylist li img {float:left;margin-right:5px;margin-top:7px;background:#EFEFEF;border:0;} 
.spydate{font-size:10px;color:#0284C2;padding:2px 0px;margin:0px0px;height:15px;font-family:Tahoma,Arial,verdana, sans-serif;} 
.spycomment{font-family:Tahoma,Arial,verdana, sans-serif;font-size:10px;color:#262B2F;padding:0px;margin:-2px 0px;} 
</style> 
<script language='javascript'> 
imgr = new Array(); 
showRandomImg = true; 
boxwidth = 255; 
cellspacing = 6; 
borderColor = "#232c35"; 
bgTD = "#000000"; 
thumbwidth = 40; 
thumbheight = 40; 
fntsize = 12; 
acolor = "#666"; 
aBold = true; 
icon = " "; 
text = "comments"; 
showPostDate = true; 
summaryPost = 20; 
summaryFontsize = 10; 
summaryColor = "#666"; 
icon2 = " "; 
numposts = 10; 
home_page = "http://www.tuliskan.com/";
limitspy=5 
intervalspy=4000 
</script> 
<div id="spylist"> 
<script src='http://skripnyawbw.googlecode.com/files/newestarticle.js' type='text/javascript'></script></div>

Keterangan:
  • 300 = Lebar Box Slider
  • 10 = Jumlah post yang ditampilkan
  • Ganti kode yang berwarna oranye dengan URL blog anda
  • 40 = Lebar Thumbnail/gambar post
  • 40 = Tinggi Thumbnail/gambar post

6. Selanjutnya pergi ke halaman Template > Edit HTML > Pastikkan kode jQuery seperti dibawah ini sudah ada pada template anda (versi berapapun), kalau belum ada silahkan letakkan kode dibawah ini tepat diatas </head>.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

7. Klik "Save", dan Selesai.

Demikian informasi terbaru seputar tutorial dan tips trik blogging tentang Membuat Widget Artikel Terbaru Slider di Blog, semoga bermanfaat, dan selamat mencoba.

Postingan terkait:

— —