Cara Membuat Widget Recent Post Bergerak Ke Bawah

Bookmark and Share
Cara Membuat Recent Post Bergerak Ke Bawah  yah itulah Tips Dan Trik Tutorial Blogspot   tentang Membuat Recent Post Bergerak Ke Bawah  or hanya keyword google Cara Membuat Recent Post  + Thumbnail dengan Jquery  Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Recent Post adalah widget Blog  yang akan menampilkan beberapa artikel / postingan terakhir blog. Adapun jumlah portingan yang di tampilkan bisa diatur sesuai keinginan kita dengan mengacak - acak kode HTMLnya.  
Cara Membuat Recent Post Bergerak Ke Bawah  Dengan widget recent post ini, pengunjung akan dengan mudah melihat beberapa artikel terakhir yang diposting di blog. Dengan sekali klik, pengunjung akan langsung menuju ke artikel yang masih fresh.Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Cara Membuat Widget  Recent Post Bergerak Ke Bawah                         
Cara Membuat Recent Post Bergerak  ,Di artikel sebelumnya saya sudah menulis tutorial membuat Recent Post / Artikel Terakhir dengan Thumbnail. Dengan fungsi thumbnail, Widget Recent Post  akan menampilkan Gambar yang ada di dalam artikel seperti yang biasa kita jumpai pada Widget Related Post / Artikel Terkait yang dipasang di akhir artikel / postingan blog.
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Secara tidak sengaja, saya menghapus JavaScript Recent Post Thumbnail BLOGGERBUGIS yang tersimpan di sites google. Cara Membuat Widget  Recent Post Bergerak Ke Bawah         
Karena malas upload kembali JSnya, sekalian saja saya memasang Widget Recent Post Thumbnail yang baru yang telah di tambahkan efek MARQUEE / Berjalan. Dengan efek marquee, Widget Recent Post Thumbnail BB jadi tampak lebih menarik. Related Post Thumbnail akan BERGERAK turun dengan teratur.
Hasilnya, jadilah Widget Recent Post Thumbnail Animasi hehehe....
Belum puas dengan animasinya, sekalian saja saya tambahkan bingkai yang tidak bisa di gunakan untuk foto dinding. Hasilnya... silhkan lihat sendiri pada sidebar blog BLOGGERBUGIS ini (kalau belum diganti dengan yang lebih canggih hehe...).Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Cara Membuat Widget  Recent Post Bergerak Ke Bawah                         
Cara Membuat Recent Post Bergerak , Mau tahu cara memasang Widget Related Post Tumbnail Animasi yang bergerak turun dan dilengkapi dengan bingkai yang tidak bisa digunakan untuk foto dinding di rumah pada blog anda ? (Kalau kalimatnya terlalu panjang, silahkan ambil nafas dulu. Bernafas melalui hidung... lalu keluarkan melalui bokong hehehehe......).
Cara Membuat Widget  Recent Post Bergerak Ke Bawah                       
Copy kode HTML berikut :
 <center><table border="2" cellpadding="7"><tbody><tr><td><center><style type="text/css">
#rp_plus_img{height:280px;overflow:hidden;border:solid 0px #000000;padding:6px 10px 14px 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:85px;padding:0px;list-style:none;}
#rp_plus_img a{color: #000000;}
#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold !important;color:#000000;text-align:left;}
#rp_plus_img .news-text{display:block;font-size:12px;font-weight:normal !important;color:#DF0101;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #DF0101;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="https://sites.google.com/site/bloggerbugis/js/RergerakBB4U%282%29.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1000;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 20;
var numchars = 45;
</script> <script src="http://blogger-bugis.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center></td></tr></tbody></table></center>

 Paste di NOTEPAD atau Microsoft Office Word.
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Ganti kode yang berwarna BIRU dengan url blog anda.

Selanjutnya....................Cara Membuat Widget  Recent Post Bergerak Ke Bawah     
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Tambahkan gadget baru pada blog anda dengan memilih kotak HTML/JavaScript lau paste kode Related Post yang telah anda ganti dengan URL BLOGANDA sendiri lalu simpan.
Selesai........ Cara Membuat Widget  Recent Post Bergerak Ke Bawah                         
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Jika ingin mengedit kode yang lain, silahkan edit kode HTML Recent Postnya yang di beri warna MERAH sesuai petunjuk berikut :Cara Membuat Widget  Recent Post Bergerak Ke Bawah     
Cara Membuat Widget  Recent Post Bergerak Ke Bawah          
height:280px; Adalah tinggi Kotak Recent Post. Silahkan ganti angka 280 menjadi angka yang lebih banyak jika ingin membut kotak yang lebih panjang atau sebaliknya.
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
font-size:14px;font-weight:bold !important;color:#000000; Adalah kode untuk Besar huruf dan warna Judul artikel. Ganti angka 14 menjadi lebih besar jika ingin membuat Teks Judul menjadi lebih besar dan sebaliknya. Kode #000000 adalah kode warna hitam. Silahkan diganti dengan kode warna anda jika anda menginginkan warna lain pada judul artikel yang akan ditampilkan Related Post.
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
font-size:12px;font-weight:normal !important;color:#DF0101; Adalah kode untuk tulisan yang ada di bawah gambar thumbnail yang merupakan kalimat pertama artikel. Cara mengedit kodenya sama seperti cara mengedit judul artikel di atas.Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Cara Membuat Widget  Recent Post Bergerak Ke Bawah
var speed = 1000;Cara Membuat Widget  Recent Post Bergerak Ke Bawah         
var pause = 3500; Adalah kecepatan Gambar bergerak Turun dan Lama Gambar Terdiam sebelum bergerak. Ganti angka 1000 jika ingin membuat gambarnya bergerak turun lebih cepat dan sebaliknya. Begitu juga dengan angka 3500 jika ingin membuat gambar terdiam lebih lama dan sebaliknya, sebelum gambar bergerak turun.Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Cara Membuat Widget  Recent Post Bergerak Ke Bawah          
var numposts = 20; adalah jumlah judul postingan / artikel yang akan di tampilkan secara bergantian. Silahkan ganti angka 20 menjadi lebih besar jika ingin menampilkan lebih banyak judul artikel pada widget recent postnya, atau sebaliknya.Cara Membuat Widget  Recent Post Bergerak Ke Bawah        
Cara Membuat Widget  Recent Post Bergerak Ke Bawah           
Jika anda masih ingin mengedit kode yang lain, silahkan saja. Kalau widgetnya hancur baru tau rasa, Oce bro.. semoga Tutorialnya Cara Membuat Recent Post Bergerak bermanfaat... Salam Blogger...Cara Membuat Widget Recent Post Bergerak Ke Bawah                                                              

{ 0 komentar... Views All / Send Comment! }

Poskan Komentar