Teks Bergerak Pada Menu Bar

Langkah 1

<script language='JavaScript'>
var txt=" Perkataan anda di sini. ";
var kelajuan=250;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kelajuan);}bergerak();
</script>

Info :-
Anda boleh gantikan kode dibawah ini mengikut kesesuaian anda.
var txt=" Tuliskan teks anda di sini. ";
var kelajuan=250

Langkah 2

Cara Pemasangan.

1. Login ke Blogger, Klik Design :

2. Pada Elemen Halaman, klik Add Gadget di lokasi yang Anda ingin letak;

3. Pilih HTML/Javascript;

4. Copy paste code HTML diatas ke dalam Content yang telah tersedia;

Semoga Berjaya :)

Meletakkan Favicon Di Blogger Dengan Mudah

 

Favicon' ialah nama singkatan bagi 'Favourite Icon'.Anda mungkin sudah biasa melihat 'Favicon' iaitu icon kecil yang terdapat di sebelah alamat URL sesebuah blog atau website seperti screenshot di bawah ini:

Untuk membuat 'Favicon' di alamat blog anda,Sila lihat langkah-langkah di bawah ini.

Mula-mula mesti mempunyai icon 'direct URL', untuk mendapatkan icon 'direct URL' ini anda mestilah mengupload icon anda ke dalam 'hosting' penyimpanan gambar anda sepeti Photobucket,Imageshack,Picison semua contoh website ini menyediakan perkhidmatan percuma.dan anda boleh upload gambar anda dibawah ini.

Langkah 1

Anda perlu mencari Gambar yang ingin anda gunakan dan download dahulu di document anda.
Untuk lebih senang anda hanya perlu pilih di http://www.iconj.com/animated_favicon.php

Langkah 2

Anda perlu upload gambar tadi disini(Apa-apa saiz boleh)
http://www.iconj.com/generator.php

Selepas itu


Setelah anda upload akan keluar seperti ini

anda perlu copy kode yang telah disediakan

Langkah 3

Untuk langkah seterusnya masuk akaun blogger anda.
Pergi ke -> Design(Layout) -> dan tekan -> Edit Html

Anda perlu search dan letak kode yang anda copy dibawah kode yang anda search.

</head>

dan letakkan kode yang telah anda copy tadi dibawah </head>

Akhir sekali simpan dan lihat blog anda.

Cara pasang Slide out navigation floating di atas header

Untuk memasang Slide Out Navigation floating pada sebelah atas blog seperti yang boleh anda lihat pada blog ini, hanya ikut beberapa langkah yang mudah di bawah.

Langkah 1

Login Blogger Dashboard --> Design --> Add A Gadget --> HTML/Javascript.

langkah 2

Copy dan paste kod di bawah pada content HTML/Javascript.

<style>
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 0px;
list-style: none;
z-index:999999;
width:721px;
}
ul#navigation li {
width: 103px;
display:inline;
float:left;
border:0;
}
ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#E7F2F9;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.96;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
ul#navigation li a:hover{
background-color:#CAE3F2;
}
ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#60ACD8;
font-family:trebuchet-ms, arial, tahoma, Sans-Serif;
font-weight:bold;
text-shadow: 0 -1px 1px #fff;
}
ul#navigation .rss a{
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzUzdKJ46bzZAD_eyqI-f_FJwzf_ujtLNAJPC8WwJ2YglqQ8fUXJr0pbSAIZns28nj9NRDn5QHFOdRmlkAJpcOUjLgtL8BQRMnQ5Ll9R-EeBjkIX6swwNOFk2jnWfRIItoYk-CDCJOavs/s400/rss.png);
}
ul#navigation .facebook a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuL457KAhqa8vZ1qUv9936-BCYKaFUUMpiBC9vNijM9AAQ1K8lwJJ0jXX-1h8pcuOyOLdubn9Gsx6VywPTcamDzzjHkfuHPwU9aNfJNdVDwtLcK2hPCGHF6kKDAcGr91ljhjiSISP0Fss/s400/facebook.png);
}
ul#navigation .twitter a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfoc-NKhgPHyZbg2eQ7Hu5TIHCeHqi33SOKZ_53YQUVe9fhVFORnt_kE66oyPIg666s4ZCWt2YE0VeUR0FnzEbpRbCZvvXSAKi3uw51ea617YIAzD1EX-_emawqqSkgDDWl_XUSulQnYs/s400/twitter.png);
}
ul#navigation .about-me a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-nwZJh9etPSQcGCx4K4NfklpiPZ4f5d1GAbwM8iETplDqInhyphenhyphenB744x3NDnjxYNWYUhe-uX_LpXG8BEVsZNnubzdWw10sd-87gRa-lyUjaAq04BQKk1-OfWoA72-rZcYkzFhaZoa5x3JU/s400/photo.png);
}
ul#navigation .e-mail a {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_BV_VOyuQ1A8djx1UE9D5wLgZC0Hf4HU5m746hnTMRnTCU8GacTolBu5FQLGKoSSFIaGukgmLI_uA_tg7vvgWqfQOE3aBbtmbAExEhnBZcwjzh7XBq1MMFkfHumbx6MPyH83qdSB7M1k/s400/mail_edit.png);
}
</style>

<script type="text/javascript" src="https://sites.google.com/site/jquery01/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});

$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
</script>

<ul id="navigation">
<li class="rss"><a href="http://nama-blog-anda.blogspot.com/atom.xml"><span>RSS Feed</span></a></li>
<li class="facebook"><a href="http://www.facebook.com/profile.php?id=masukkan-ID-Facebook-disini"><span>My Facebook</span></a></li>
<li class="twitter"><a href="http://twitter.com/masukkan-ID-Twitter-disini"><span>My Twitter</span></a></li>
<li class="about-me"><a href="http://draft.blogger.com/profile/masukkan-ID-Blogger-disini"><span>My Profile</span></a></li>
<li class="e-mail"><a href="mailto:masukkan-email-disini@gmail.com"><span>My E-Mail</span></a></li>
</ul>

p/s:

1.Untuk mengubah warna background, sila edit kod background-color:#E7F2F9;

2. Untuk mengubah warna tulisan, sila edit kod color:#60ACD8;

3. Untuk memasukkan ID bagi akaun Facebook, Twitter , RSS Feed, Profile dan E mail anda, sila edit kod yang di bold dengan warna merah.

Akhir sekali, klik Save.

Sila drag kotak Jquery Slide Out Navigation dan letakkan di bawah post jika terdapat tanda yang keluar pada efek tersebut.

Jika anda ingin mengubah icon, anda boleh dapatkan icon-icon yang menarik di Dryicons.com

Falling Star Pada Blog

Klik Gambar untuk lihat lebih jelas

Dulu saya post mengenai Floating bubble di blog ,Kali ini bintang di blog anda.Mesti cantik apabila letak di blog.Bagi sesiapa yang berminat boleh ikuti langkah-langkah dibawah ini.

Langkah 1

Copy kode dibawah ini.

<script type="text/javascript" src="https://sites.google.com/site/jeritanblog/javascript/fallingstar.js"></script>

Langkah 2

Cara Pemasangan.

1. Login ke Blogger, Klik Design :

2. Pada Elemen Halaman, klik Add Gadget di lokasi yang Anda ingin letak;

3. Pilih HTML/Javascript;

4. Copy paste code HTML diatas ke dalam Content yang telah tersedia;

Ringankan blog dengan jQuery Lazy Load

Lazy Loader adalah plugin jQuery di mana efek lazy load akan menangguhkan proses loading bagi image yang terdapat pada blog. Efek Lazy load hanya akan berfungsi apabila page di scroll. Image selepas page yang di scroll akan terpapar dengan menggunakan efek jQuery Lazy Load. Untuk melihat Demo, sila klik di sini.

Lazy Load membantu meringankan blog dengan mengurangkan tempoh masa proses loading page pada sesebuah blog terutama pada blog yang banyak memaparkan image gambar ataupun image yang bersaiz besar.

Untuk memasang jQuery Lazy Load di blogspot, ikut beberapa langkah di bawah.

Langkah 1

Login Blogger Dashboard --> Design --> Add A Gadget --> HTML/Javascript.

Copy dan paste kod di bawah pada content HTML/Javascript.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5FoJn6E0DkscWgj8FrjtOvu8BkOA-cW1TIYG2WSFUzauT4D02IXfiFTDkSj2dtGBYagwOG9CV5LMSQiE9VuYLyaSKmjuf9OJtSNPWiEKZeIMShqiHV_715ZcKDR4s6Cjois_LMqn6Xz4/s1600/grey.gif"
});
});
</script>

Akhir, sekali, klik Save.


p/s:

1. Jika tiada sebarang efek berlaku selepas kod di Save, sila paste kod tersebut sebelum atau di atas kod </body> pada script template.

2. Jika tiada seberang perubahan selepas kod di paste di atas atau sebelum kod </body>, sila paste kod tersebut sebelum atau di atas kod </head>

Google Translate Widget

	Gadgets powered by Google

Draw pembaca lebih ke blog anda dengan google's menterjemah widget! Tambah alat Terjemahan ke laman web anda, dan menawarkan akses cepat ke penterjemahan automatik dari laman tersebut. Salin dan tampal kod di bawah ini ke blog atau website anda.
<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/translatemypage.xml&up_source_language=en&w=160&h=60&title=&border=&output=js"></script>

Icon Top of Page terapung

Beberapa blog dan laman web yang telah obnoxiously laman yang berlangsung selamanya ... dan di sanalah widget ini akan menolong. Seperti yang dapat anda lihat, ada panah mengambang kecil di bahagian-bahagian kanan bawah halaman ini. Selalu mempertahankan kedudukan yang sama. Tatal ke bawah sedikit di template anda, maka jika anda mengklik, itu akan membawa anda ke bahagian paling atas halaman.

Mengapa hal yang baik?

* Menjimatkan pengunjung anda dari kerumitan yang tidak perlu bergulir ke atas.
* Ikon tidak mengganggu dengan kandungan anda.
* Anda boleh menggunakan gambar anda sendiri untuk berbaur dengan blog anda sendiri.

Dapatkan Widgets Ikon Terapung

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="Back to Top"><img src="http://img119.imageshack.us/img119/8589/arrowupcx2.gif" /></a>


* Jika anda ingin menukar gambar anak panah untuk sesuatu yang lain, kemudian cari baris ini di bawah ini dan menggantikannya dengan yang lain url gambar

http://img119.imageshack.us/img119/8589/arrowupcx2.gif

Daun berguguran di Blog anda

Selamat sejahtera,entry yang lepas Beautiful Following Star Blog,kali ini saya akan buat satu lagi daun berguguran diblog anda.Setelah saya mencuba ada sesetengah templates yang tidak boleh guna dan Template Designer New! .Siapa nak ikut tutorial dibawah.

demo :-sila pergi ke http://www.bisnesauralife2u.blogspot.com

1. Anda Perlu Login.

2.Copy kode dibawah ini dan paste di HTML widget.

<script type="text/javascript" src="http://nikbir09.ws/jeritanblog/daunberguguran.js"></script></div>

Langkah 21. Login ke Blogger, Klik Design :

2. Pada Elemen Halaman, klik Add Gadget di lokasi yang Anda ingin letak;

3. Pilih HTML/Javascript;

Kemudian Masukkan kode yang telah anda copy tadi.

P/S: Kalau ada masalah komen kat bawah nie.