Cara Membuat Tulisan Berjalan Marquee Text Di Blog

Berikut ini cara membuat tulisan berjalan (Marquee Text) Di Blog yang mungkin sering anda lihat saat membuka sebuah blogspot/situs. Dengan menggunakan atau menambahkan kode Marquee yang dipasang pada blog ini, anda bisa menampilkan tulisan berjalan di blog sesuai keinginan anda, bisa mempercantik dan menyampaikan info ke pembaca.


Kita pahami dulu kode dasar untuk membuat Marquee text, yaitu seperti berikut:

<marquee>ISI TULISAN YANG BERJALAN</marquee>

contoh menjadi seperti ini

ISI TULISAN YANG BERJALAN

Nah, setelah anda tahu kode dasarnya, sekarang bagaimana cara memasang kode ini di blogger. Bisa kita pasang di artikel/postingan atau tambah gadget melalui Tata letak.


Cara memasang kode Marquee pada artikel/postingan:

1. Silakan ubah dari Mode Compose ke mode HTML

2. Masukkan kode Marquee di mode HTML

3. Sekarang klik/pindah di mode compose dan untuk melihat hasilnya, klik pratinjau.


Cara memasang kode Marquee pada widget

1. Masuk ke menu Tata Letak, lalu klik tambah gadget/add gadget

2. Pilih HTML/Java Script dan masukkan kodenya, lalu Simpan.

Untuk mempercantik, kita bisa mengubah warna, jenis huruf, dan ukuran teks:

Berikut bermacam kode Marquee yang bisa anda pakai:

style="font-family: Arial; font-size:20px; color:#00FF66;"

Arial adalah jenis huruf
20px adalah ukuran huruf
#00FF66 adalah warna huruf

Silakan lihat contoh berikut untuk membuat kodenya.

<marquee bgcolor="red" style="font-family: Arial; font-size:20px; color:#00FF66;">WARNA BACKGROUND UNTUK TEKS MARQUEE</marquee>

Lihat hasilnya:

WARNA BACKGROUND UNTUK TEKS MARQUEE

Silakan gunakan kode berikut untuk pilihan yang ingin anda gunakan:


1. Kode untuk pengulangan Rotasi

<marquee loop="5">TEKS AKAN BEROTASI 5 KALI</marquee>

Contoh

TEKS AKAN BEROTASI 5 KALI

Silakan ganti pada angka 5, teks akan hilang setelah berjalan 5 kali.


2. Kode untuk mengatur lebar teks

<marquee width="50%">LEBAR TEKS YANG BERJALAN UNTUK SETENGAH BIDANG</marquee>

Contoh

LEBAR TEKS YANG BERJALAN UNTUK SETENGAH BIDANG

Silakan ganti pada angka 50%


3. Kode membuat link pada Marquee teks

Jika anda klik pada teks berjalan, maka akan diarahkan ke link yang anda masukkan.

Kode dasar adalah sbb:

onmouseover="this.stop()" onmouseout="this.start()"

Untuk penerapan, contohnya sbb:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()"><a href="http://musttrie-art.blogspot.com/p/daftar-isi.html">CARA MEMBUAT TULISAN BERJALAN</a></marquee

CARA MEMBUAT TULISAN BERJALAN

Ganti kode http://musttrie-art.blogspot.com/p/daftar-isi.html


4. Kode untuk memberikan warna background pada jalur teks.

Contoh kode, sbb:

<marquee bgcolor="blue">CONTOH BACKGROUND AREA TEKS</marquee>

CONTOH BACKGROUND AREA TEKS

Silakan ganti kode warnanya.


5. Kode scrolldelay, untuk mengatur kecepatan/waktu jeda (milidetik)

Contoh kodenya adalah:

<marquee scrolldelay="500">JEDA TEKS BERJALAN ADALAH 0,50 DETIK</marquee>

JEDA TEKS BERJALAN ADALAH 0,50 DETIK

Anda bisa ganti angka 500


6. Kode untuk memberi pesan saat kursor diarahkan pada area teks

Contoh kodenya:

<marquee title="TEKS PESAN MUNCUL SAAT KURSOR SOROT TEKS">TEKS BERJALAN BERISI PESAN</marquee>

TEKS YANG BERJALAN BERISI PESAN


7. Kode untuk mengatur kecepatan teks berjalan

Contoh kode:
<marquee scrollamount="10">INI PADA KECEPATAN TEKS BERJALAN 10</marquee>

INI PADA KECEPATAN TEKS BERJALAN 10

Silakan ganti angka 10. Semakin besar angka semakin cepat teks berjalan.


8. Kode untuk mengatur arah teks bergerak (kiri, kanan, atas, bawah)

Kode direction="left/right/up/down" berguna untuk mengatur arah pergerakan teks.

Contoh kode adalah sbb:

<marquee direction="left">TEKS BERJALAN KE KIRI</marquee>

TEKS BERJALAN KE KIRI

Ganti left sesuai yang diinginkan.


9. Kode untuk mengatur teks berhenti saat dilintasi mouse.

onmouseover="this.stop()" onmouseout="this.start()"

Contoh kode:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()">INI CONTOH TEKS BERGERAK KE KIRI DAN BERHENTI SAAT DILINTASI MOUSE</marquee>


INI CONTOH TEKS BERGERAK KE KIRI DAN BERHENTI SAAT DILINTASI MOUSE


Selamat bereksperimen dan terus melakukan yang terbaik bagi semua, kita jumpa dilain waktu, salam sukses!