Cara Membuat Teks Berjalan di Blog

Cara Membuat Teks Berjalan di Blog - Pernah tidak sobat melihat tulisan / teks yang mondar - mandir di suatu blog?? saya rasa pasti sudah pernah.. namanya marquee sob! fungsinya sebenarnya hanyalah sebagai hiasan di blog, hampir sama dengan headline news (baca : memasang headline news di blog) cuma yang ini lebih mudah ngaturnya, terutama dalam mengatur gerakan / prilaku teks yang di inginkan. Sobat yang tertarik membuat tulisan yang mondar - mandir ini, silahkan ikuti terus tutorialnya.

Cara Teks Tulisan Berjalan di Blog

1.  Tulisan bergerak dari kanan ke kiri

<marquee direction="left" scrollamount="2" align="center">http://rituelde.blogspot.com/</marquee>

 Seperti ini hasilnya bro...

http://rituelde.blogspot.com/

2.  Tulisan bergerak dari kiri ke kanan

<marquee direction="right" scrollamount="2" align="center">http://rituelde.blogspot.com/</marquee>

 begini hasilnya bro...

http://rituelde.blogspot.com/

3. Tulisan bergerak bolak balik (mondar-mandir) dari kanan ke kiri

<marquee direction="left" scrollamount="2" align="center" behavior="alternate">http://rituelde.blogspot.com/</marquee>

lihatlah hasilnya...

http://rituelde.blogspot.com/

4. Tulisan bergerak bolak balik (mondar-mandir) dari kiri ke kanan

<marquee direction="right" scrollamount="2" align="center" behavior="alternate">http://rituelde.blogspot.com/</marquee>

 hasilnya bro...

http://rituelde.blogspot.com/

5. Tulisan bergerak dari atas ke bawah

<marquee direction="down" scrollamount="2" align="center">http://rituelde.blogspot.com/</marquee>

lalu hasilnya seperti ini bro...

http://rituelde.blogspot.com/

6. Tulisan bergerak dari bawah ke atas

<marquee direction="up" scrollamount="2" align="center">http://rituelde.blogspot.com/</marquee>

seperti ini bro hasilnya...

http://rituelde.blogspot.com/

7. Tulisan bergerak mondar-mandir dari atas ke bawah

<marquee direction="up" scrollamount="2" align="center" behavior="alternate">http://rituelde.blogspot.com/</marquee>

lalu hasilnya seperti ini bro...

http://rituelde.blogspot.com/

8. Tulisan bergerak zig-zag (diagonal) memantul

<center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate">http://rituelde.blogspot.com/</marquee></marquee></center>

dan begini hasilnya bro...

http://rituelde.blogspot.com/

9. Tulisan bergerak zig-zag (diagonal) tembus

<center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right"> http://rituelde.blogspot.com/</marquee></marquee></center>

terus begini hasilnya bro...

http://rituelde.blogspot.com/

Cara memasang :

1. Login ke akun blog sobat
2. Masu ke Dashboard
3. Klik Layout (Tata Letak --> Add  Gadget (Tambah gadget) --> HTML/Javascript
4. Masukkan kode marquee dari salah satu tulisan berjalan diatas
5. Klik save dan lihat hasilnya.

Catatan :

• Direction : untuk mengatur pola gerakan teks (left, right, up dan down)
• Scrollamount : untuk mengatur kecepatan gerakan teks. Naikkan angkanya (dari 2 menjadi 3 ) untuk mempercepat gerakan dan sebaliknya.
• Behavior ( scroll/slide/alternate ): untuk mengatur prilaku gerakan.
• Untuk menambahkan background, padding, border, color, dll pada marquee, silahkan sisipkan  kode marquee antara kode berikut

<div style="background: #EE1111; border: 2px solid #4FEE11; color: white; font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center">http://rituelde.blogspot.com/</marquee>
</div>

    * Ganti tulisan warna Biru sesuai dengan yang sobat inginkan, pilih diantara 1-9 yang ada diatas...
    * Ganti tulisan warna Hijau dengan tulisan yang sobat inginkan...
Lalu hasilnya begini....

http://rituelde.blogspot.com/

 Untuk menyisipkan link pada marquee, gunakan kode berikut :

<div style="background: #EE1111; border: 2px solid #4FEE11; color:white ; font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center"> <a href="http://rituelde.blogspot.com/2012/10/cara-membuat-teks-berjalan-di-blog.html"/>http://rituelde.blogspot.com/</a></marquee> </div>

    * Ganti tulisan yang berwana Merah dengan Url yang di inginkan.

hasilnya...

http://rituelde.blogspot.com/

Contoh lain
Jika pointer diarahkan ke teks, maka teksnya berhenti

Blogger Tutorials - Rituel
1. Cara Membuat Burung Twitter Terbang di Blog
2. Cara Membuat Tulisan Berjalan di Blog
3. Cara Membuat 'Contact Me' di Blog
4. Kode HTML Warna
5. Cara Mengganti Template Blog

Berikut Kodenya

<div style="background: #000000; border: 2px solid #b08006; color: white; font-size: 16px; font-weight: no bold; letter-spacing: 0.1em; padding: 15px;">
<marquee align="center" direction="up" height="150" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" width="100%">Blogger Tutorials - Rituel<br />
<a href="http://rituelde.blogspot.com/2012/10/cara-membuatmemasang-burung-twitter.html/">1.  Cara Membuat Burung Twitter Terbang di Blog</a><br />
<a href="http://rituelde.blogspot.com/2012/10/cara-membuat-teks-berjalan-di-blog.html">2.  Cara Membuat Tulisan Berjalan di Blog</a><br />
<a href="http://rituelde.blogspot.com/2012/10/cara-membuat-contact-me-di-blog.html">3.  Cara Membuat 'Contact Me' di Blog </a><br />
<a href="http://rituelde.blogspot.com/2012/10/kode-html-warna.html">4.  Kode HTML Warna </a><br />
<a href="http://rituelde.blogspot.com/2012/10/cara-mengganti-template-blogspot.html">5. Cara Mengganti Template Blog</a><br />
</marquee>
</div>

 * Kode yang berwarna biru adalah perintah pada teks untuk terhenti ketika di lewati pointer

Selamat Mencoba & Good Luck ....