Selamat datang di Baltazar-Artikel.Blogspot.Com

Membuat Recent Post dengan Animasi

Wednesday 19 December 20120 comments



Pada kali ini saya mencoba berbagi suatu cara mempercantik blog Anda dengan membuat Recent Post dengan Animasi seperti blog saya di sidebar ini.

Kebetulan saya mendapatkan cara ini dari sesama blogger dan saya akan berbagi kembali untuk rekan blogger yang berminat untuk menggunakan-nya.

Caranya begitu mudah, Anda tinggal mengikuti langkah - langkah yang saya uraikan dibawah ini :

1. Buka Akun Blog milik Anda

2. Pilih Tata Letak pada Dashbor Blog Anda.

3. Klik Tambah Gadget.

4. Pilih HTML/JavaCript.

5. Copy Paste Script dibawah ini.

Recent Post Animasi :
<center><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
</script>
<style media="screen" type="text/css">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:299px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:270px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
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:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>
<script language="javascript">
imgr = new Array();
imgr[0] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[1] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[2] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[3] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
imgr[4] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://NamaBlogAnda/";
limitspy=4
intervalspy=4000
</script>

<div id="spylist">
<script src="https://sites.google.com/site/unwanted86/javascript/animatedrecentpost.js" type="text/javascript">
</script></div>
<small><a href="http://baltazar-artikel.blogspot.com/2012/12/membuat-recent-post-dengan-animasi.html" target="_blank">widget here</a></small></center></div>



6. Simpan hasilnya yang sudah di Copy Paste tadi.

7. Lihat hasilnya.

Catatan :

- Ganti yang berwarna Merah dengan ukuran masing - masing gadget Anda.
- Untuk yang berwarna Biru, ganti dengan nama URL/Nama Blog  Anda.

Oke ..... Mudah bukan cara buatnya. Semoga bermanfaat untuk Anda.

Salam.



Share this article :

Post a Comment

Subscribe via RSS Feed If you enjoyed this article just click here, or subscribe to receive more great content just like it.

IKLAN

 
Support : Cara Gampang | Creating Website | Johny Template | Mas Templatea | Pusat Promosi
Copyright © 2011. ARTIKEL: Musik | Software | Game | Gratis | Semua Gratis - All Rights Reserved
Template Created by Creating Website Modify by CaraGampang.Com
Proudly powered by Blogger