Home » » Tutorial Widget Post Terbaru Dengan Efek Sliding Untuk Blogger

Tutorial Widget Post Terbaru Dengan Efek Sliding Untuk Blogger

Posted by Hanif Bin Idrus Blog on Tuesday, May 19, 2015



REAL DEMO UNTUK BLOG INI ADALAH SEPERTI DI BAWAH


Tutorial Widget Post Terbaru Dengan Efek Sliding Untuk Blogger
Jika anda ingin mencuba, berikut adalah cara-cara untuk memasang widget ini.

1. Dari Blogger Dashboard ----- Layout ---- Add a Gadget ---- HTML/Javascript

2. Salin html code berikut dan paste di ruangan 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://hanifidrus.blogspot.com/2015/05/tutorial-widget-post-terbaru-dengan.html" target="_blank">dapatkan widget ini</a></small>

Setting yang boleh diubah mengikut kesesuaian:

  1. Ketinggian - ubah  #rp_plus_img{height:295px;mengikut kesesuaian.
  2. Jumlah artikel terkini ubah var numposts = 20
  3. Bilangan karakter (huruf) pada snippet post,  var numchars = 100
  4. Tukar warna pautan Tajuk Post: #rp_plus_img a{color:#3366ff;} Lihat Carta Warna Di Sini

Thanks for reading & sharing Hanif Bin Idrus Blog

Previous
« Prev Post

0 comments:

Popular Posts

IKLAN

Recent Post

Recent Posts Widget

IKLAN

BABAB

Followers