• img

Cara Membuat Recent Post Terbaru Blogspot

blog sauted | Minggu, 11 November 2012 | 17:29

Cara Membuat Recent Post Terbaru Blogspot - recent post yang memiliki cuplikan beserta gambar thumbnail yang bergerak gerak. fungsinya adalah dapat mempermudah pengunjung untuk melihat cuplikan cuplikan artikel terbaru sobat.

nah sekarang langsung saja kita ke tutorial cara buat recent post gambar thumbnail bergerak di blog dengan mudah :

Pertama, Login ke akun blogger.com sobat.
Kedua, Pilih rancangan atau design.
Ketiga, Pilih add gadget pada bagian page elements dan lalu pilih html javascript.
Keempat, isikan judul seterah sobat dan copas kode recent post di bawah ini ke kotak tersebut dan ganti tulisan merah dengan alamat blog sobat.

<center><style type="text/css">
#rp_plus_img{height:300px;overflow:hidden;border:solid 0px #fff;padding:6px 10px 24px 5px;background-color:transparent;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:1px; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:60px;padding:5px;list-style:none;}
#rp_plus_img a{color:#F68629;}
#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold !important;color:#F68629;text-align:justify;}
#rp_plus_img .news-text{display:block;font-size:11px;font-weight:normal !important;color:#000000;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #F68629;width:95px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="http://theplick.googlecode.com/files/newsticker-plick.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1000;
var pause = 2500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 20;
var numchars = 0;
</script> <script src="http://www.xblogsx.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center>

Lalu save dan lihat hasilnya...

Source: www.berryhs.com

Saat ini SAHABAT berada di area blog sauted dengan artikel Cara Membuat Recent Post Terbaru Blogspot.
<< >>