Membuat Recent post tumbnail slide

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Membuat Recent post tumbnail slide dan semoga artikel ini bermanfaat.

---

Membuat Recent post tumbnail slide ini mungkin bagi para blogger yang suka/hobi menghias blog akan sangat berguna sekali untuk memperindah tampilan blog. tampilan yang berbeda dengan resent post biasa dan dengan pemasangannya yang gampang bahkan bagi pemula sekalipun karena kode yang harus dipasang cukup diletakan di widget tanpa harus memasang di Edit HTML.

Ya.. langsung saja ke tutorialnya...

Langkah-lanhkahnya:

1. Login ke akun Blogger sobat
2. Klik Perancangan >> Elemen Laman
2. Klik Tambah Gadget
3. Pilih HTML/Javascript
4. Masukan kode berikut :

<style type="text/css">
#rp_plus_img{height:282px;overflow:hidden;border:solid 0px #585858;padding:6px 10px 14px 5px;background-color:none;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:0; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:60px;padding:5px;list-style:none;}
#rp_plus_img a{color:#000;}
#rp_plus_img .news-title{display:block;font-weight:bold !important;margin-bottom:4px;font-size:11px;}
#rp_plus_img .news-text{display:block;font-size:10px;font-weight:normal !important;color:#282828;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 0px #585858;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="http://my-project-favicon.googlecode.com/files/relatepost.js"></script>
<script type="text/javascript">
var speed = 400;
var pause = 2500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img">
<script style="text/javascript">
var numposts = 25;
var numchars = 75;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
</ul>

5. Klik Simpan
6. Lihat hasilnya.

Keterangan dan Catatan :

1. Untuk membuat halaman menjadi lebih tinggi, gantilah nilai height:282px sesuai keinginan;
2. Untuk mengganti kecepatan, rubahlah nilai var speed = 400; sesuai keinginan sobat;
3. Rubahlah nilai var numposts = 25; untuk menampilkan jumlah postingan;
4. Rubahlah nilai var numchars = 75; untuk mempilkan jumlah karakter;
5. Feed sobat harus diset "Penuh" melalui "Pengaturan - Feed Situs - Izinkan Feed Blog : Penuh" atau sobat bisa langsung masukkan feeds sobat dalam script tersebut.

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Membuat Recent post tumbnail slide kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered

BACA JUGA ARTIKEL TERKAIT LAINNYA

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 18:02