Contoh hasil Slideshow Recent post Yang KEREN |
Kali ini saya akan bagikan cara memasang Slideshow artikel terbaru atau recent post pada blog.
Fungsi dari widget ini untuk mempermudah pengunjung blog anda menemukan artikel artikel terbaru yang anda posting.
Recent post dapat ditampilkan dengan banyak ragam, dan salah satu dari ragam tersebut salah satunya yang saya bagikan pada anda ini.
Widget ini dapat dikatakan cukup keren karena artikel terbaru yang anda posting dapat ditampilkan include dengan thumbmail atau gambar, selain itu dalam interval waktu tertentu gambar dan link postingan anda akan dirotasi ke bawah
Sebenarnya widget ini bukan hal yang baru, namun bagi anda yang mungkin belum tau atau saat ini anda sedang mencari dan membutuhkan refrensi mempercantik tampilan blogger anda dengan memasang widget Slideshow
Saya tidak tau siapa pembuat widget ini, dan oleh karenanya saya mengapresiasi hasil karya ini untuk beliau.
Baik,
kita persingkat saja, anda dapat melihat gambar diatas sebagai contoh dari Slideshow ini, jika tertarik
Ikuti petunjuk dibawah ini:
1. Silakan Login terlebih dahulu ke akun blog milik anda
2. Kemudian pilih Tata Letak
3. Kemudian Klik Tambahkan Gadget
4. Kemudian Pilih HTML/javascript
5. Silakan Copy Kode di bawah ini dan pastekan di HTML/javascript tadi.
<style type="text/css"><br />#rp_plus_img{height:385px;overflow:hidden;border:0;padding:2px 3px 3px 2px;background:transparant}<br />#rp_plus_img ul{list-style-type:none;margin:0;padding:0}<br />#rp_plus_img li{border:solid 1px #ccc; margin:0;height:82px;padding:5px; list-style:none;-moz-border-radius: 10px; border-radius: 5px}<br />#rp_plus_img li:hover{background-color: #EFFBEF;}<br />#rp_plus_img a{color:#d90000;font-weight:bold}<br />#rp_plus_img .news-title{display:block;font-weight:400 !important;margin-bottom:3px;font-size:11px;}<br />#rp_plus_img img{float:left;margin-right:10px;padding:4px;border:solid 1px #ccc;width:65px; height:65px;-moz-border-radius: 10px; border-radius: 5px;}<br /></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="http://cosoft-intimedia.googlecode.com/files/Slideshow-artikel-terbaru-New-version.js"></script>
<script type="text/javascript"><br />var speed = 1500;<br />var pause = 3500;<br />$(document).ready(function(){<br />rpnewsticker();<br />interval = setInterval(rpnewsticker, pause);<br />});<br /></script>
<ul id="rp_plus_img">
<script style="text/javascript"><br />var numposts = 40;<br />var numchars = 60;<br /></script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>
Keterangan:
Silakan sesuaikan yang saya tandai dengan warna
color:#d90000; Warna Judul Postingan
var numposts = 40; Jumlah postingan yang akan di tampilkan
var numchars = 60; Jumlah character/huruf yang akan di tampilkan
6. Simpan/save ! dan Selesai
Selamat Mencoba!!
©~~~~~~~~~
Sumber : Berbagai Sumber
URL : -
Editor : Agung Riyanto
Post : AR
©~~~~~~~~~