Rabu, 14 November 2012

Membuat Judul blog bergerak dan membuat judul blog muncul satu persatu seperti diketik

Membuat Judul blog bergerak dan membuat judul blog muncul satu persatu seperti diketik adalah salah satu cara untuk membuat blog sobat menjadi terlihat lebih menarik. Nah, selain itu judul blog bergerak ini pun memiliki fungsi lain sob, mungkin sobat memiliki sebuah blog yang judul blognya panjang, judul blog bergerak dan muncul satu persatu ini merupakan salah satu alternatif agar judul blog sobat yang panjang terbaca. Oiya, judul blog yang dimaksud ini adalah nama blog sobat. Untuk melihat contohnya, judul blog saya adalah "Nhe Blogger's Naxz BeThawiie".


Hanya dengan mengubah sedikit kode html template sobat, judul blog bergerak pun jadi. Pada postingan sebelumnya juga kita pernah membahas tentang Cara membuat judul adress bar tampil beda. Sama dengan postingan sebelumnya, kita menggunakan script yang dapat membuat judul blog bergerak. Untuk gerakannya, judul blog bergerak ini satu jenis dengan marquee. Yaitu bergerak dari kanan ke kiri. Okedeh sobat, tanpa basa-basi lagi silahkan sobat lihat bagaimana cara Membuat Judul blog bergerak di bawah ini.
  1. Masuk ke blogger.com dan login menggunakan akun blog sobat
  2. Masuk pada halaman Template
  3. Klik Edit HTML lalu Lanjutkan
  4. Cari kode <title><data:blog.pageTitle/></title>, untuk mempermudah pencarian gunakan ctrl+f
  5. Jika kode tersebut sudah ditemukan, ganti kode tersebut dengan kode di bawah ini:
    <b:include data='blog' name='all-head-content'/>

    <script language='JavaScript'>
    var txt="<data:blog.pageTitle/> - ";
    var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;
    txt=txt.substring(1,txt.length)+txt.charAt(0);
    segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
    </script>
    - tulisan berwarna merah adalah kode dari kecepatan gerakan judul blog. Jadi bisa sobat ganti sesuai dengan keinginan sobat.
    - tulisan berwarna biru adalah kode otomatis dari judul blog sobat. Nah, bisa sobat ganti dengan mengganti kode berwarna biru tersebut dengan judul blog sobat yang diinginkan
  6. Sebelum sobat simpan, silahkan klik Pratinjau terlebih dahulu agar judul blog berjalan sesuai dengan keinginan sobat
  7. Jika sudah pas dan sesuai dengan keinginan sobat silahkan klik Simpan Template

Dan ini adalah cara membuat judul blog muncul satu persatu seperti diketik.


Ada beberapa cara untuk membuat judul blog menjadi animatif. Seperti yang udah saya tulis sebelumnya bagaimana cara membuat judul blog bergerak atau marquee (ke kiri atau ke kanan), trik kali ini sedikit berbeda dimana judul blog akan muncul seperti sebuah ketikan dari masing-masing huruf.


Tanpa berlama lama berikut cara membuatnya :
  • Login ke blogger
  • Pilih Tata Letak → Edit HTML → Expand Template Widget
  • Cari kode </body> agar mudah mencari tekan f3
  • Paste script berikut ini di atas kode </body>

<script>
var tit = document.title;
var c = 0;
function writetitle() {
document.title = tit.substring(0,c);
if(c==tit.length)
{
c = 0;
setTimeout("writetitle()", 2000)
}
else {
c++;
setTimeout("writetitle()", 275)
}
}
writetitle()
</script>
Simpan dan lihat hasilnya
Selamat Mencoba !

Tidak ada komentar:

Posting Komentar