Cara Membuat Tulisan Berjalan Di Blogger Dengan Marquee

Otak Cerdas - Mempunyai sebuah situs atau blog yang kontenya bermanfaat dan berguna bagi setiap pengunjung merupakan hal yang utama bagi pemilik blog atau situs tersebut. namun di sebuah blog atau situs yang memiliki tulisan yang bisa berjalan juga suatu keunikan bagi situs atau blog tersebut.

Cara Membuat Tulisan Berjalan Di Blogger Dengan Marquee

Apalagi jika situs atau blog yang anda kelola merupakan blog perusahaan atau blog yang menawarkan jasa jual beli online, nah dengan dilengkapi sebuah tulisan yang bisa berjalan maka situs atau blog tersebut akan terlihat lebih mantab, lebih oke dan ini juga bisa menarik perhatian bagi para pengunjung pastinya.

Tapi mungkin di antara sobat ada yang masih belum tau caranya membuat tulisan agar bisa berjalan pada sebuah situs atau blog yang di kelolanya. jika ini yang anda cari, berarti anda sudah berada di blog yang tepat. Karena pada postingan artikel kali ini saya akan memberikan beberapa kode Marquee yang akan membuat Tulisan di blog anda bisa berjalan, atau bisa berjalan bolak balik dan lain sebagainya.

Apa Itu Marquee?

Lebih tepatnya marquee adalah salah satu kode bahasa pemprograman HTML (HyperText Markup Language), Fungsi dari marquee adalah untuk membuat efek tulisan/gambar di situs menjadi berjalan atau bergerak dengan banyak beragam gaya.

Nah lalu bagaimana cara membuat Tulisan di blog agar bisa berjalan dengan menggunakan kode marquee tersebut, Tenang sobat ! Dibawah ini saya sudah menyiapkan beberapa kode marquee yang langsung siap pakai dan sudah lulus dengan hasil uji Coba.

Kode dasar Tag Marquee :

Di bawah ini saya akan mencontohkan kode marquee yang paling mendasar dulu ya, sebelum anda mencoba kode marquee yang lainya. ada pun kodenya adalah sebagai berikut :

<marquee> TULISAN BERJALAN DARI KANAN KE KIRI </marquee>

Hasil dari kode di atas secara default teks akan berjalan dari kanan ke kiri dan berulang terus menerus tanpa henti.

Hasilnya Sebagai Berikut :

TULISAN BERJALAN DARI KANAN KE KIRI

1. Tulisan berjalan dari kanan ke kiri, atau dari kiri ke kanan

<marquee direction="left" scrollamount="10"> Tulisan berjalan ke kiri </marquee><br /> <marquee direction="right" scrollamount="10"> Tulisan bejalan ke kanan </marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan ke kiri
Tulisan bejalan ke kanan

2. Tulisan berjalan dari atas ke bawah, atau dari bawah ke atas

<marquee align="center" direction="down" scrollamount="3"> Tulisan berjalan ke bawah </marquee><marquee align="center" direction="up" scrollamount="3"> Tulisan berjalan ke atas </marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan ke bawah Tulisan berjalan ke atas

3. Tulisan berjalan memusat atau berlawanan arah (kiri kanan)

<marquee direction="right" width="50%"> Tulisan berjalan arah memusat</marquee><marquee direction="left" width="50%"> Tulisan berjalan arah memusat </marquee><marquee width = "50%"> Tulisan berjalan berlawanan arah </marquee><marquee direction="right" width="50%"> Tulisan berjalan berlawanan arah </marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan arah memusat Tulisan berjalan arah memusat Tulisan berjalan berlawanan arah Tulisan berjalan berlawanan arah

4. Tulisan berjalan memantul (bolak balik Bro)

<marquee behavior="alternate" scrollamount="10"> Tulisan berjalan memantul (Bolak balik Bro)</marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan memantul (Bolak balik Bro)

5. Tulisan Berjalan Zig Zag

<marquee behavior ="alternate" direction = "up" height="60px" scrollamount="30"> <br /> <marquee direction="right" scrollamount="6"> Tulisan berjalan zig-zag </marquee> </marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan zig-zag

6. Tulisan Berjalan Melayang

<marquee behavior="alternate" direction="up" height="100" scrollamount="6" weight="460"> <marquee behavior="alternate" direction="right"> Tulisan berjalan melayang </marquee> </marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan melayang

7. Tulisan Berjalan Dengan Background

<marquee align ="center" direction ="left" scrollamount="10"> Tulisan berjalan dengan background</marquee>

Hasilnya Sebagai Berikut :

Tulisan berjalan dengan background

8. Tulisan berjalan dengan link

Kalau yang ini agak unik ya, dan tulisan akan berhenti ketika mouse pointer di letakkan di atasnya

<marquee align="center" direction="up" height="200" onmouseout ="this.start()" onmouseover = "this.stop()" scrollamount="2" width="100%"> <a href="https://www.otakcerdas.com/2025/04/membuat-tulisan-berjalan-marquee.html?"> Cara Membuat Tulisan Berjalan Di Blogger Dengan Marquee</a><br /> <a href="https://www.otakcerdas.com?"> Otak Cerdas Blogger Kaltim </a><br /> <a href="https://www.otakcerdas.com?"> Otak Cerdas Tutorial Blogger dan Facebook Profesional </a><br /> </marquee>

Hasilnya Sebagai Berikut :

Cara Membuat Tulisan Berjalan Di Blogger Dengan Marquee
Otak Cerdas Blogger Profesional Samarinda Kaltim
Otak Cerdas - Tutorial Blogger Dan Facebook Profesional

9. Tulisan Berjalan Dengan Atribut (Loop)

Tulisan ini berjalan hanya 5x putaran saja, Setelah itu tulisan akan berhenti. Untuk melihat gerakan, silahkan di refresh dulu Browser nya.

<marquee loop="5" width="450"> Tulisan berjalan dengan loop </marquee> <br /> <marquee behavior ="slide" loop="5" width="450"> Tulisan berjalan dengan loop </marquee>

Terimakasih Atas Waktu Dan Kunjungan Anda Semua ... Salam Blogger Dan Semoga Kesuksesan Selalu Menyertai Anda

Kesimpulan:

Tag <marquee> merupakan elemen HTML sederhana yang digunakan untuk membuat teks atau elemen lain bergerak secara otomatis di halaman web. Meskipun sudah tidak direkomendasikan dalam standar HTML5, marquee masih sering digunakan di platform seperti Blogger karena kemudahan penerapannya.

Dengan berbagai atribut seperti direction, scrollamount, dan behavior, pengguna dapat mengatur arah, kecepatan, dan gaya gerak teks berjalan sesuai kebutuhan. Untuk tampilan yang lebih modern dan responsif, marquee bisa digantikan dengan animasi CSS, namun bagi pemula atau blogger yang ingin efek cepat tanpa kode kompleks, <marquee> tetap menjadi solusi praktis.

Penutup:

Itulah cara membuat tulisan berjalan di Blogger menggunakan tag <marquee>. Meskipun sederhana, efek ini bisa memberikan sentuhan menarik pada tampilan blog Anda, terutama untuk menampilkan pengumuman, promo, atau informasi penting. 

Namun, pastikan penggunaannya tidak berlebihan agar blog tetap nyaman dilihat dan profesional. Jika Anda ingin tampilan yang lebih modern, Anda juga bisa mempertimbangkan animasi CSS sebagai alternatif. Semoga tutorial ini bermanfaat dan bisa membantu anda mempercantik blog dengan mudah. Jangan lupa share ya dan tinggalkan komentar jika ada pertanyaan atau kendala

Arief Setiawan Blogger Indonesia Yang senang berbagi ilmu, Seputar tutorial blogger, optimasi SEO dan informasi tentang sosial Media

Berbagi :