1. Pasang widget recent post default blogger
widget Recent post ini di peruntukkan bagi blogger yang tidak ingin mengotak-atik kode javascript.mungkin karena tidak suka mengotak-atik kode javascript (tidak mau ribet)atau mungkin tidak tahu sama sekali tentang javascript oleh karena itu widget ini cocok untuk tipe pengguna blogger yang seperti itu.
Login blogger >> rancangan/design >> page elements >> add gadget >> pilih menu featuredtambah gadget recent post.
ada dua gadget untuk recent posts default blogger yaitu recent post tanpa thumbnail atau tanpa gambar dan recent post with thumbnail.
- untuk recent post tanpa thumbnail sobat pilih yang seperti gambar di bawah ini.
setelah selesain mengatur gadgetnya jangan lupa pilih save.
- Untuk recent post with thumnail atau artikel terbaru dengan gambar sobat bisa lihat gambar di bawah ini.
setelah selesai jangan lupa simpan gadget dan lihat hasilnya.
2. Pasang widget recent post di lengkapi thumbnail
recent post serta thumbnail ini sangat cocok untuk blogger yang ingin blognya di percantik dengan thumbnail atau gambar tentang artikel terbarunya.caranya cukup mudah.
Login blogger terlebih dahulu kemudian pilih menu rancangan/design setelah itu pilih sub menu page elements dan pilih tambah/add gadget kemudian tambahkan gadget HTML/javaScript.setelah menambahkan gadget HTML/javaScript maka letakkan kode di bawah ini ke dalam content.
kemudian apabila sobat ingin mengedit kode javascriptnya di bawah ini adalah kode yang sobat edit/sesuaikan dengan blog sobat.<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 = 300;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "http://NAMABLOGKAMU.com/";
</script>
<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>
boxwidth = Ukuran dari kotak Widget
cellspacing = Spasi diantara cells
thumbwidth dan thumbheight = Ukuran lebar dan tinggi kotak gambar
numposts = Jumlah recent post yang akan sobat tampilkan..
home_page = http://NAMABLOGKAMU.com/ (ganti alamat blog sobat)
setelah selesai mengedit jangan lupa pilih save/simpan dan lihat hasilnya.
3. Pasang widget recent post with slideshow
Untuk widget recent posts yang ketiga ini menggunakan fasilitas slideshow agar blog lebih indah di pandang.caranya cukup mudah yaitu login blogger >> rancangan/design >> page elements >> add gadget >> tambahkan gadget HTML/javaScript kemudian masukkan kode di bawah ini ke dalam content.
kemudian pilih simpan gadget dan lihat hasilnya.<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 = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
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.blog-sobat.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>
Mungkin untuk sementara hanya itu pilihan cara memasang widget recent poats di blogger apabila ada terdapat kesalahan kami mohon bantuan sobat blogger untuk sama-sama memperbaikinya dengan cara berkomentar.untuk artikel pasang widget recent posts di blogger saya cukupkan sampai disini semoga bermanfaat dan selamat mencoba.
1 comments:
thanks gan tutorialnya..
sangat membantu..
langsung tak praktekin..hohoho
mampir keblog ane ya gan..
jarowak.blogspot.com
makasih banyak..hoho :)
Post a Comment