Teras Info - Untuk membuat sedikit variasi pada blog kita, mungkin ada baiknya kita mencoba beberapa trik untuk mempercantik blog kita itu, misalnya dengan cara membuat slide recent post di blog kita. Slide recent post ini merupakan kumpulan posting terbaru yang kita terbitkan namun pada saat tampil akan membentuk suatu slide, untuk contohnya silahkan lihat pada pojok kanan atas blog ini.
Lalu bagaimana cara membuatnya? mungkin bagi sebagian blogger, terutama blogger seniot hal ini sangatlah mudah, tapi mungkin bagi sebagian lagi ini adalah hal baru yang cukup baik untuk dijadikan perbendaharaan kita sebagai blogger.
Untuk membuatnya silahkan ikuti langkah berikut ini:
1. Masuk dulu ke menu dasbor blog anda, kemudian klik pada pilihan rancangan
2. Setelah itu pilih Elemen Halaman
3. Kemudian klik tambah gadget
4. Klik pada pilihan html/java script
5. Silahkan copy paste script di bawah ini :
<script language='javascript'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 600;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 80;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://www.teras-info.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>
Pada bagian yang saya beri warna merah tebal, silahkan ubah alamat blognya dengan alamat blog anda, kemudian pada bagian yang saya beri warna biru tebal silahkan ubah nilai 10 menjadi sesuka anda, misalnya lima dan sebagainya.
Keterangan:
-home_page = "http://www.teras-info.blogspot.com/"; merupakan tempat dimana tempat alamat postingan blog anda. Jadi jangan lupa untuk mengganti alamatnya dengan blog anda.
-numposts = 10; merupakan jumlah postingan atau artikel yang akan di tampilkan pada slide yang anda buat.
Setelah anda selesai melakukan langkah-langkah di atas, silahkan klik simpan dan kemuadian silahkan anda lihat hasilnya.....Selamat mencoba......
Lalu bagaimana cara membuatnya? mungkin bagi sebagian blogger, terutama blogger seniot hal ini sangatlah mudah, tapi mungkin bagi sebagian lagi ini adalah hal baru yang cukup baik untuk dijadikan perbendaharaan kita sebagai blogger.
Untuk membuatnya silahkan ikuti langkah berikut ini:
1. Masuk dulu ke menu dasbor blog anda, kemudian klik pada pilihan rancangan
2. Setelah itu pilih Elemen Halaman
3. Kemudian klik tambah gadget
4. Klik pada pilihan html/java script
5. Silahkan copy paste script di bawah ini :
<script language='javascript'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language='javascript'>
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 600;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 80;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "http://www.teras-info.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>
Pada bagian yang saya beri warna merah tebal, silahkan ubah alamat blognya dengan alamat blog anda, kemudian pada bagian yang saya beri warna biru tebal silahkan ubah nilai 10 menjadi sesuka anda, misalnya lima dan sebagainya.
Keterangan:
-home_page = "http://www.teras-info.blogspot.com/"; merupakan tempat dimana tempat alamat postingan blog anda. Jadi jangan lupa untuk mengganti alamatnya dengan blog anda.
-numposts = 10; merupakan jumlah postingan atau artikel yang akan di tampilkan pada slide yang anda buat.
Setelah anda selesai melakukan langkah-langkah di atas, silahkan klik simpan dan kemuadian silahkan anda lihat hasilnya.....Selamat mencoba......
waduh, byk bgt kode2nya sob, aku save dulu ya bwt aku plajari
BalasHapusslm knl jg ya
skedar mampir cari tmn baru..
BalasHapusmampir balik ya
kalo slide most popular post ada gag?
BalasHapusboleh juga nih dicoba di blogspot saya. makasih mas.
BalasHapussaya penasaran sama model "Komentar Terbaru" blog ini
BalasHapusshare juga cara bikinnya ya mas, tengs bratz
untuk wordpress gimana ya????
BalasHapussip, saya ijin save ya...
BalasHapusya silahkan jika ingin mengnyimpannya..
BalasHapusduh.. blog spot... au ahhh masih gelap !!
BalasHapussalam persahabatan
bener, mas. slider membuat tampilan blog menjadi lebih menarik. bisa utk engine wordpress, ndak?
BalasHapusga sia - sia berkunjung balik...siip bos...
BalasHapusini khusun bloger di wordpress.com bisa ga
BalasHapushackzy
BalasHapusmksh info nya
wahh kerennn ijin nyoba gan
BalasHapus-->> http://jogsa.net
kang bantuin ane dong wat optimalin blog punya ane..maklum pan qt beda jurusan jd kga tw soal script.
BalasHapus(V.O ikhsan)
Mohon ijin pinjam tutorialnya
BalasHapusMksih gan, tp kq gmbr yg muncul tinypic..hrus diganti dgn pa tuh, trims.
BalasHapuslama tidak bikin blog, sudah banyak yang jadi master. Salam kenal
BalasHapusbagus sip lah..!!
BalasHapusgan mw ga tukeran link ke www.warpsite.blogspot.com
BalasHapusthx infona gan... sekalian di follow ya gan... ntar q follow balik gan... mampir ke blog ane ya gan. heheheh
buat mas fauzi sama mas reza putra ada kok gan... sama aja malahan... cuma kalo lwat word press mdg ditanam aja di html... diatas b:skin
BalasHapusgan saya mw nanya gimana cara menambah relasi blog kita agar dikenal oleh banyak blog gimana gan???
BalasHapusmas, kalau slidenya kekana/ke kiri , kira2 scriptnya seperti apa, mohon bantuannya ya
BalasHapushalo bro atau sist.. terima kasih ya info nya.. saya saya terbantu banget deh.. dari sekian banyak skrip yang saya pake, ternyata yang di teras info yang berhasil.. trims n keep up the good job :)
BalasHapussalam kami,
http://PondokJamTangan.blogspot.com/