Cara Mudah Membuat Tulisan Berjalan (marquee) di blog dengan Kode HTML

Cara Membuat efek tulisan bergerak atau berjalan di halalaman blog, baik wordpress , blogspot maupun flatform blog lainnya sebenarnya sangat mudah sekali, cukup dengan beberapa baris kode perintah saja maka tulisan berjalan bisa anda pasang di halaman blog anda baik di bagian header, footer, body sidebar atau di bagian lainnya yang anda inginkan pada halaman blog anda.

Tulisan berjalan (running text) dikenal sebagai marquee, karena untuk membuat tulisan berjalan pada halaman blog anda, perintahnya adalah menggunakan tag marquee, kode perintah ini merupakan salah satu perintah kode tag HTML untuk membuat tulisan menjadi bergerak sesuai dengan yang kita inginkan.



Ada beberapa variasi gerakan yang bisa kita buat dengan kode HTML marquee ini, ada yang tulisan berjalan dari kiri ke kanan, berjalan dari kanan ke kiri, di ulang-ulang, dari atas ke bawah atau dari bawah ke atas atau bisa juga kita buat tulisan bergerak mondar mandir secara acak, bahkan kita bisa dekorasi tampilannya sesuai dengan yang kita inginkan dengan menggabungkannya dengan kode CSS.

Kali ini saya akan sajikan beberapa contoh kode HTML untuk membuat tulisan berjalan dengan berbagai macam variasi gerak yang bisa anda pilih dan tempelkan pada halaman blog anda untuk menghiasi blog anda agar lebih ramai dan menarik.

Format Kode HTML untuk Membuat Tulisan Berjalan

Format Kode html dasar untuk membuat tulisan berjalan adalah sebagai berikut:

<marquee [attribut] >sebuah text bergerak </marquee>

[attribut] sifatnya opsional (boleh disertakan boleh tidak), fungsinya untuk mengatur, mendekorasi atau memvariasikan tulisan berjalan yang anda inginkan.

Macam-Macam Atribut Tag Marquee

Ada banyak atribut kode HTML untuk tag marquee ini diantaranya adalah:

• scrollday=angka, ini digunakan untuk mengatur delay tulisan berjalan dalam milidetik (1/1000 detik), semakin besar angkanya maka gerakannya akan semakin lambat.
• loop=angka | -1 | infinite, atribut loop ini digunakan agar tulisan terus berulang sesuai dengan aturan yang kita pilih, jika yang dimasukan angka maka tulisan akan bergerak berulang-ulang sesuai dengan angka yang dimasukan, jika yang dipilih adalah -1, maka tidak akan diulang, jika infinite maka akan berulang-ulang terus menerus.
• width=angka/persentase, ini digunakan untuk mengatur lebar tempat tulisan berjalan semakin besar angkanya akan semakin lebar
• bgcolor=warna dalam bhasa inggris, atribut ini digunakan untuk memberikan latar atau background pada tulisan bergerak yang anda buat.
• title=text, atribut ini digunakan agar tulisan berjalan ketika di sentuh memakai mouse (mouse over) akan muncul pesan popup.
• scrollmount=angka, atribut ini digunakan untuk mengatur kecepatan gerak tulisan, semakin besar angka yang dimasukan maka akan semakin cepat gerakannya
• direction=left | right | up | down, atribut ini digunakan untuk mengatur arah gerakan tulisan berjalan, bisa pilih salah satu left, atau right atau up atau down, jika memilih left maka tulisan akan berjalan ke kiri, jika memilih right maka tulisan akan berjalan ke arah kanan, jika memilih up maka tulisan akan berjalan ke atas dan jika memilih down maka tulisan akan berjalan ke arah bawah.
• behavior=scroll | slide | alternate, atribut ini digunakan untuk mengatur jenis prilaku gerakannya, pilih slide jika menginginkan tulisan bergerak berhenti dan diulangi lagi dari awal, pilih scroll jika ingin teks bergerak sekali kemudian berhenti dan diulangi lagi, pilih Alternate jika ingin teks terlihat memantul/bouncing dari ujung kembali ke ujung.
• style=kode_css, style diisi dengan kode css, jadi anda harus menguasai kode css untuk menggunakan atribut ini, kode css gunanya untuk mendekorasi tampilan text berjalan yang anda inginkan seperti mewarnai text, mewarnai latar belakang tulisan, memilih font, memilih format font tebal miring dan lain sebagainya.

Dengan mengetahui atribut untuk kode html tag marquee di atas, maka anda akan dengan mudah membuat text berjalan untuk halaman blog anda dengan berbagai macam variasi sesuai dengan yang anda inginkan.

Format Penulisan Attribut pada Tag Marquee

Atribut bisa anda masukan di dalam tag marquee lebih dari satu atribut, jika atribut yang dimasukan lebih dari satu, maka setiap atribut yang satu dengan atribut lainnya dipisahkan dengan space, formatnya penulisannya kurang lebih akan terlihat seperti berikut:

<marquee atribut1='nilai_attr1'  atribut2='nilai_attr2' attribut3='nilai_attr3' attribut_n='nilai_attr_n'>text berjalan</marquee>

Nilai atribut bisa menggunakan kutif tunggal, kutif ganda atau tanpa kutif, huruf besar dan huruf kecil tidak dibedakan.

Contoh Cara Mebuat Tulisan Berjalan dengan berbagai variasi

Berikut saya sajikan beberapa contoh cara membuat tulisan berjalan dengan beberapa variasi yang bisa anda terapkan pada blog anda:

#1. Membuat Tulisan berjalan standar (dari kanan ke kiri)

Kode Html:

<marquee> Ini contoh tulisan berjalan</marquee>

Hasil:
Ini contoh tulisan berjalan

#2 - Tulisan berjalan dari kiri ke kanan dengan efek memantul

Kode HTML:

 <marquee direction='left' behavior='alternate'> Ini contoh tulisan berjalan mondar mandir</marquee>

 Hasil:
Ini contoh tulisan berjalan mondar mandir

#3 - Tulisan Berjalan dari Kiri ke kanan

Kode HTML:

<marquee directoion='right'>Ini tulisan berjalan dari kiri ke kanan</marquee>

Hasil:
Ini tulisan berjalan dari kiri ke kanan

#4 - Tulisan Berjalan dari kiri ke kanan dengan efek memantul

Kode HTML:

<marquee direction='right' behavior='alternate'>Tulisan berjalan dari kiri ke kanan memantul </marquee>

Hasil:
Tulisan berjalan dari kiri ke kanan memantul

#5 - Tulisan berjalan dari atas ke bawah

Kode HTML:

<marquee direction='down'>Tulisan berjalan dari atas ke bawah </marquee>

Hasil:
Tulisan berjalan dari atas ke bawah

#6 - Tulisan Berjalan dari atas ke bawah mondar-mandir

Kode HTML:

<marquee direction='down' behavior='alternate'>Tulisan berjalan dari atas ke bawah mondar-mandir</marquee>

Hasil:
Tulisan berjalan dari atas ke bawah mondar-mandir

#7 - Tulisan berjalan dari kiri-ke kanan memantul dengan background kuning dan warna tulisan merah

Kode HTML:

<marquee behavior='alternate' direction='right' bgcolor='yellow' style='color:red;font-weight:bold;'>

Hasil:
Tulisan berjalan berlatar kuning dengan warna tulisan merah

#8 - Tulisan berjalan dengan gerak acak

Kode HTML:

<center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate"> Contoh Tulisan Berjalan </marquee></marquee></center>

Hasil:
Contoh Tulisan Berjalan

Kunci Penting Membuat Tulisan Berjalan

Sebenarnya untuk membuat tulisan berjalan apapun jenis dan variasinya sangatlah mudah, apa yang harus anda pahami adalah kode berupa tag HTML untuk membuat tulisan berjalan ayitu tag marquee, dan atribut yang dapat digunakan oleh tag html marquee tersebut, seperti yang sudah disebutkan di atas, dengan mengkombinasikan antara tulisan berjalan dan juga atribut yang sudah ditentukan maka anda bisa membuat tulisan berjalan sesuai dengan kreatifitas anda. silahkan bereksperimen sendiri dengan melibatkan atribut-atribut lainnya.

Bagaimana cara Menerapkan (memasang) tulisan berjalan pada halaman blog anda?

Untuk memasang tulisan berjalan pada halaman blog anda bukanlah perkara yang sulit, caranya sangatlah mudah sekali, ada dua cara yang bisa anda gunakan, yang pertama bisa melalui editor artikel yang anda buat dan yang kedua bisa melalui widget.

Melalui Artikel

Jika anda ingin memasang tulisan berjalan hanya untuk beberapa artikel saja, maka langkah-langkahnya adalah sebagai berikut:

• Saat anda sedang membuat artikel, masuk ke mode HTML
• Kopikan salah satu kode HTML tulisan berjalan di atas pada bagian artikel yang anda ingin tulisan bergerak tersebut muncul
• Simpan artikel anda kemudian silahkan review untuk melihat hasilnya sebelum dipublish

Melalui Widget

Kode HTML untuk tulisan berjalan juga bisa anda pasang melalui widget blog, langkahnya adalah sebagai berikut:

• Masuk ke halaman utama akun blog anda
• Pada bilah menu sisi kiri, pilih menu pilih menu tata letak / layout
• Klik link tambahkan gadget yang ada, di bagian yang anda ingin tulisan berjalan muncul
• Lalu pilih widget HTML/Javascript, kemudian kopikan salah satu kode di atas, lalu tekan tombol simpan

Dengan cara di atas tulisan berjalan yang anda inginkan akan muncul di bagian widget yang anga tambahkan, silahkan dicoba.

Artikel menarik lainnya:
Cara membuat tulisan terbalik

Itulah tutorial tentang bagaimana cara membuat tulisan berjalan untuk halaman blog anda, silahkan bereksperimen sendiri untuk membuat tulisan berjalan sesuai dengan yang anda inginkan, kode untuk membuat tulisan berjalan adalah kode HTML standar, jadi anda bisa memasang kode HTML untuk tulisan berjalan apapun flatform blognya, baik blogspot, wordpress dan blog lainnya. selamat mencoba. dan semoga berhasil.