Cara Memasang Berita Artikel Terbaru Dengan Efek Animasi

Hallo sobat blogger, kali ini akan saya bagikan sebuah widget artikel terbaru dengan efek animasi untuk blog yang sobat gunakan. Dimana kita ketahui bahwa berita artikel terbaru ini sangat vital sekali untuk sebuah blog, karena dengan di pasangnya widget artikel baru ini pada blog, para pengunjung akan lebih mudah mengetahui artikel yaang baru saja sobat buat.


Cara Memasang Berita Artikel Terbaru Dengan Efek Animasi


Dengan menggunakan widget ini, tampilan berita artikel terbaru sobat akan menjadi lebih menarik dan para pengunjung tidak mudah bosan karena widget ini terus bergerak.
Nah, jika sobat tertarik untuk memasang widget Artikel Terbaru Dengan Efek Animasi ini, berikut tutorialnya:

1. Sobat Login terlebih dahulu ke dalam blog yang sobat kelola
2. Pada dasbor blogger, klik menu Tata Letak atau dalam bahasa inggris disebut Layout


Cara Memasang Berita Artikel Terbaru Dengan Efek Animasi

3. Di dalam menu Layout ini, klik Tambahkan Gadget



4. Setelah itu akan muncul jendela kecil kumpulan widget bawaan bogger, sobat cari saja HTML/Javascript kemudian klik dua kali.


Cara Memasang Berita Artikel Terbaru Dengan Efek Animasi

5. Pastekan kode dibawah ini kedalam kolom yang telah di sediakan


<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 #0090ff;}
#rp_plus_img a{color:#0090ff;}
#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>

6. Sobat bisa merubah warna widget ini agar sesuai dengan warna blog sobat dengan mengganti kode warna yang saya beri warna merah di atas.
5. Setelah pengaturan selesai, terakhir klik Simpan.


Di Bawah Ini Tampilan Widget Berita Artikel Terbaru Dengan Efek Animasi 

Cara Memasang Berita Artikel Terbaru Dengan Efek Animasi


Semoga artikel tutorial blog ringan ini dapat bermanfaat untuk semua sobat blogger, jika ada pertanyaan ataupun kritik dan saran, sobat bisa menuliskannya pada kolom komentar yang ada di bawah artikel ini. Terimakasih telah berkunjung. 


Previous
Next Post »