Cara Membuat Tab Bar Bergerak di Blog

Berikut adalah contoh Tab Bar yang dapat bergerak di blog.

Berhubung teman saya ada yang belum tau caranya, maka saya sengaja buat posting ini. Saya mendapatkan ini yaitu dengan mencari dari blog lain. Yaa apa salahnya kita berbagi? :)

Caranya adalah sbg berikut.

1. Login ke Blog kamu seperti biasa.
2. Pilih Tata Letak
3. Pilih Edit HTML
4. Sebelum kalian mengeditnya, backup dulu templatenya dengan Download Template Lengkap. Apa fungsinya? Yaitu untuk menghindari hal yang yg tidak kita harapkan terjadi pada blog kita. Kalau denagn cara ini, kita jadi bisa mengembalikan template kita yang semula :)
5. Cari kode </head>. Supaya mudah, kalian bisa menekan tombol Ctrl + F dan apabila telah didapatkan, kode tersebut akan memiliki text background color yg berbeda dr yg lain.
6. Kemudian copy-paste kode berikut dan kemudian letakkan berada tepat kode tadi.
<script language='JavaScript'>var txt=" Tulis Disini "; var kecepatan=120;var segarkan=null;function bergerak() { document.title=txt; txt=txt.substring(1,txt.length)+txt.charAt(0); segarkan=setTimeout("bergerak()",kecepatan);}bergerak(); </script>
7. Ganti pada tulisan "Tulis Disini" dengan kata-kata keinginan kalian. Misalnya Welcome to, Selamat Datang, dll.
8. Jangan lupa untuk klik Simpan Template. Selesai.

Selamat Mencoba. Semoga berhasil! ;)

Read more

Cara menambah Widjet Recent Post Animasi

Awalnya aku bingung loh cara dapetin ini, cuman garagara otak-atik nyari ke om google akhirnya ketemu juga deh :) Ini juga aku ambil dari blogger lain, semoga bermanfaat ya.

Caranya:

• Sign In ke blog kamu
•  Klik Rancangan -> Elemen Laman -> Tambah Gadget -> HTML/Java Script
• Terus, kamu copypaste ini:

<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://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/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://nsnabilaa.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
    <script src='http://dl.getdropbox.com/u/708209/scriptabufarhan/recentspy/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

•  Yang aku kasih tanda warna pink itu ganti dengan alamat blog kalian sendiri.
•  Udah gitu  klik Simpan aja. Gampang kan?

Lihat deh perubahan yg terjadi. Kalau mau liat contohnya ada di sebelah kanan blog ini.

selamat mencoba! :D

Read more