Cara Membuat Animasi Widget Recent Post di Blog Dengan Mudah
Namun ada kelebihan di widget saya kali ini, diantaranya widget ini akan menampilkan posting-posting terbaru dari blog sobat dengan jumlah tampilan yang bisa sobat sesuaikan. Ditambah lagi widget ini bergerak secara dropdown ke bawah dan posting yang ditampilkan paling bawah akan kembali lagi ke paling atas. Begitu juga seterusnya.
Oke, langsung saja langkahnya:
1. Login ke akun blogger sobat
2. Masuk kebagian tata letak
3. Klik tambahkan gadget, dalam pilih HTML/Javascript
4. Masukkan kode berikut didalam kotak konten
<style type="text/css">
#rp_plus_img{height:377px;}
#rp_plus_img li {height:60px;padding:5px;list-style:none;
background-color:#ffffff;
border:solid 1px #000000;}
#rp_plus_img a{color:#00000;}
#rp_plus_img .news-title{display:block;font-weight:bold ;margin-bottom:4px;font-size:11px;
text-align:justify;
-moz-border-radius: 5px;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #00000;width:55px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/unwanted86/javascript/recentpost.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1000;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 5;
var numchars = 0;
</script> <script src="http://rezakhan-share.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt">
</script></ul>
<small><a href="http://ikhwan-aryadi.blogspot.com/2013/07/Cara-Mudah-Membuat-Widget-Recent-Post-Bergerak-di-Blog.html" target="_blank">Ingin widget ini?</a></small>
*377 = Tinggi ukuran widget
*1000 & 1500 = Kecepatan dropdown widget
*5 = Jumlah post yang ditampilkan
*URL Blog = Ganti dengan URL blog sobat
5. Klik simpan, selesai.
Sekian dulu artikel Cara Cepat Menambahkan Widget Recent Post Bergerak di Blog yang mungkin sedikit singkat ini. Semoga bermanfaat.
0 komentar:
Post a Comment