Widget Recent Posts
atau Posting terbaru merupakan widget penting karena berfungsi sebagai
penunjang navigasi blog. Dengan adanya daftar posting terbaru,
pengunjung yg masuk tidak dari halaman utama (homepage) dapat langsung
mengetahui beberapa posting terbaru dari sebuah blog. Selain itu, widget
recent posts dapat menjadi sebuah tawaran bagi pengunjung blog untuk
mengetahui isi posting-posting lain dari blog tersebut.
- Jika semuanya sudah, jangan lupa klik "Simpan". Silahkan sobat lihat hasilnya.
Widget recent post yg saya share
kali ini memiliki fitur dan tampilan yg cukup menarik. Kombinasi script
recent posts, auto scroll / spy list menghasilkan widget recent posts Blogger
yg memiliki efek hebat dan dapat mengundang ketertarikan pengunjung.
Alhasil, tampilan/desain blog pun dapat bertambah nilainya dengan
ditambahnya widget recent posts ini.
Tanpa basa-basi, jika sobat berminat
memasang widget recent post berjalan dengan gambar ini silahkan ikuti
langkah-langkah berikut ini.widget ini bisa diletakkan dimana
saja, mau di sidebar | Bawah postingan blog | Header | Footer | Sesuai
keinginan.berikut ini cara pemasangannnya.
- Login ke akun blogger.
- Dasbor >> Rancangan >> Elemen Laman >> Tambah Widget.
- Cari dan pilih “Html/JavaScript”.
- Masukkan kode berikut pada kotak konten!. Jangan lupa Isi judul dengan "Recent Post".
- Login ke akun blogger.
- Dasbor >> Rancangan >> Elemen Laman >> Tambah Widget.
- Cari dan pilih “Html/JavaScript”.
- Masukkan kode berikut pada kotak konten!. Jangan lupa Isi judul dengan "Recent Post".
<div style="overflow:auto;width:100%;height:300px;padding:0px;border:0px solid black">
<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: 3px;}
#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 = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 8;
var numchars = 0;
</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script></ul></div>
<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: 3px;}
#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 = 1500;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 8;
var numchars = 0;
</script><script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script></ul></div>
- Jika semuanya sudah, jangan lupa klik "Simpan". Silahkan sobat lihat hasilnya.