Saturday, February 02, 2013
Selamat datang kawan. Dalam kesempatan kali ini saya akan memberikan Tutorial Blog ringan soal Widget Blogspot tentang bagaimana Cara Membuat Recent Post Dengan Efek Animasi Di Blog. Dengan Recent Post yang akan kita terapkan kali ini yaitu Recent Post memiliki efek animasi seperti terlihat pada gambar berikut:
Fungsi Widget Recent Post itu sendiri sesuai dengan namanya yaitu berfungsi untuk menampilkan dan memberitau kepada pengunjung mengenai postingan terbaru dari blog sobat. Silakan coba untuk yang beminat.
Langsung saja kita bahas resep-resepnya sebagai berikut :
1. Patikan sobat sudah login ke akun blogger masih masing
2. Jika sudah login silahkan Pilih Menu "Tata Letak "
Langsung saja kita bahas resep-resepnya sebagai berikut :
1. Patikan sobat sudah login ke akun blogger masih masing
2. Jika sudah login silahkan Pilih Menu "Tata Letak "
3. Tambah Gadget
4. Tambahkan Widget HTML/JavaScript.
<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 type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/recentpost.js"></script>
<script type="text/javascript">
var speed = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 5;
var numchars = 0;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul><small><a href="http://dapur-tutorial.blogspot.com/2013/02/cara-membuat-recent-post-dengan-efek-animasi-di-blog.html" target="_blank">Get a Widget</a></small>
- Kode Warna Merah diatas adalah kode warna. silahkan sobat sesuaikan dengan tampilan blog sobat.
- 6. Jika sudah klik Simpan
7. dan Lihat HasilnyaItu dia bahsan kali ini soal Widget Blogspot tetang Cara Membuat Recent Post
Dengan Efek Animasi Di Blog. Semoga widget ini dapat membantu mempercantik tampilan halam blog sobat. sekian dan Terimakasih.
Post a Comment