Cara Membuat Tulisan Berjalan Menggunakan HTML Marquee Di Blogger

Read Time5 Minute, 2 Second

Belajar SEO – Kita mungkin sering melihat pada acara berita yang sedang disiarkan di televisi dan terdapat potongan informasi yang disampaikan dengan running text / text berjalan.

Di dalam dunia HTML, tulisan berjalan lebih dikenal dengan nama marquee dan lingkupannya bukan hanya sekedar teks saja, gambar pun dapat dibuat berjalan.

Karena teks yang berjalan sangat menarik perhatian, pemilik blog sering memanfaatkan marquee untuk memberikan informasi yang bersifat penting kepada seluruh orang yang mengunjungi blog kamu.

Marquee bisa dibuat dengan gampang dengan menggunakan kode HTML.

Kali ini Belajar SEO akan berbagi ilmu tentang bagaimana cara membuat tulisan berjalan menggunakan HTML <marquee> di blogger kamu lengkap dengan segala atribut nya.

 

KODE HTML DASAR <marquee>

<marquee>Teks Berjalan</marquee>

Teks Berjalan

Sebagai dasar, teks secara default akan berjalan dari kanan ke kiri secara berulang ulang

 

LOOP / PERULANGAN MARQUEE

<marquee loop=”5″>Teks Berjalan berulang 5 kali</marquee>
Teks Berjalan berulang 5 kali

 

Loop menentukan banyak perulangan yang dilakukan marquee. Angka 5 menunjukkan jumlah perulangan, setelah berjalan 5 kali marquee tidak akan muncul lagi
Teks Berjalan Berulang 5 Kali

 

JEDA WAKTU MARQUEE

<marquee scrolldelay=”500″>Teks Berjalan dengan delay 0,5 detik</marquee>
Teks Berjalan dengan delay 0,5 detik
 

Scroll delay menunjukkan jeda waktu marquee. Angka 500 memiliki satuan milidetik, jadi sama dengan 0,5 detik. Teks akan berjalan setiap 0,5 detik.
Teks Berjalan Dengan Delay 0,5 Detik

 

MEMBERIKAN TITLE MARQUEE

<marquee title=”pesan tersembunyi”>Teks Berjalan</marquee>
Teks Berjalan
 

Title memuat pesan yang akan aktif ketika kursor diarahkan ke marquee.
Teks Berjalan

 

WARNA BACKGROUND MARQUEE

<marquee bgcolor=”0000FF”>Teks Berjalan dengan warna latar belakang Biru</marquee>
Teks Berjalan dengan warna latar belakang Biru
 

Bgcolor mengatur warna background marquee. FFF300 menunjukkan kode warna HTML untuk warna biru, dapat diganti dengan warna dasar red, green, blue, atau yellow.
Teks Berjalan Dengan Latar Belakang Kuning

 

KECEPATAN GERAK MARQUEE

<marquee scrollamount=”100″>Teks Berjalan dengan kecepatan 50</marquee>
Teks Berjalan dengan kecepatan 100
 

Scrollamount mengatur kecepatan gerak marquee. Angka 100 menunjukkan kecepatannya 100, kecepatan normal adalah 6.
Teks Berjalan Dengan Kecepatan 75

 

ARAH GERAK MARQUEE

<marquee direction=”right”>Teks Berjalan ke arah kanan</marquee>
Teks Berjalan ke arah kanan
 
Teks Berjalan Ke Arah Kanan

<marquee direction=”down” height=”100″>Teks Berjalan ke arah bawah</marquee>
Teks Berjalan ke arah bawah
Teks Berjalan Ke Arah Bawah

Direction akan mengatur arah gerak marquee. Right menunjukkan arah pergerakan marquee ke kanan. Ada 4 arah yang bisa Anda gunakan :
⇒ up untuk gerak ke atas
⇒ right untuk gerak ke kanan
⇒ down untuk gerak ke bawah
⇒ left untuk gerak ke kiri (default)

 

LEBAR DAN TINGGI MARQUEE

<marquee width=”300″>Lebar Teks Berjalan 300px</marquee>
Lebar Teks Berjalan 300px
 

Lebar Teks Berjalan 300px

<marquee height=”100″>Tinggi Teks Berjalan 100px</marquee>
Tinggi Teks Berjalan 100px
Tinggi Teks Berjalan 100pc
Width untuk mengatur lebar marquee, dan height untuk mengatur tinggi marquee. Masing-masing menggunakan px sebagai satuan.

 

MENGATUR JENIS, UKURAN, & WARNA FONT MARQUEE

<marquee style=”font-family:arial; font-size:20px; color:#ffffff;”>Jenis ukuran dan warna font pada Teks Berjalan</marquee>
Jenis ukuran dan warna font pada Teks Berjalan
 

Jenis Ukuran Dan Warna Font Pada Teks Berjalan
Anda dapat mengatur jenis, ukuran, dan warna font menggunakan style.
font-family untuk jenis font
font-size untuk ukuran font
color untuk warna font

 

JENIS MARQUEE

<marquee behavior=”alternate”>Teks Berjalan memantul</marquee>
Teks Berjalan memantul

 

Teks Berjalan Memantul
Behavior akan mengatur sifat marquee. Anda dapat mengatur marquee dengan 3 nilai :
scroll : marquee menghilang ketika menabrak sisi kiri (default)
slide : marquee berhenti ketika menabrak sisi kiri
alternate : marquee memantul ketika menabrak sisi

 

MEMBUAT LINK PADA MARQUEE

<marquee><a href=”http://carabelajartutorial.blogspot.com/2016/09/cara-membuat-tulisan-berjalan-di-blog.html”>Cara Membuat Tulisan Berjalan</a></marquee>
Cara Membuat Tulisan Berjalan

 

CARA MEMBUAT TULISAN BERJALAN DI BLOG

Untuk membuat link pada teks yang berjalan, cukup dengan memasukkan kode HTML pembentuk link di dalam kode dasar marquee.

 

MEMBUAT GAMBAR BERJALAN MENGGUNAKAN MARQUEE

<marquee><img src=”https://3.bp.blogspot.com/-sf0S_LjgzTI/V-jKWHoim6I/AAAAAAAACsM/ZVo8EjSWlFYdH670iesn2b1UPf3OLkebgCLcB/s1600/cara-membuat-teks-tulisan-berjalan-marquee.png” /></marquee>


Untuk membuat link pada teks yang berjalan, cukup dengan memasukkan kode HTML pembentuk link di dalam kode dasar marquee.

 

MEMBUAT TEKS BERJALAN ZIG ZAG MENGGUNAKAN MARQUEE

<marquee direction=”up” scrollamount=”2″ align=”center” behavior=”alternate”>
<marquee direction=”right” behavior=”alternate” height=”30″>Teks Berjalan Zig Zag
</marquee>
</marquee>

Teks Berjalan Zig Zag

Teks Berjalan Zig Zag

Teks yang berjalan zig zag dapat dilakukan dengan menggabungkan 2 atribut direction (arah) dengan cara memasukkan teks berjalan diantara 2 marquee yang memiliki atribut arah berbeda. Dalam contoh kita gunakan arah up dan right sehingga membentuk zig zag.

 

CAMPURAN ATRIBUT MARQUEE

<div style=”text-align: center;”>
<span style=”font-size: x-large;”>
<marquee bgcolor=”black” style=”color: red;” direction=”left” width=”130″>
<b>&lt;&lt;</b><b> MACAM &gt;&gt;</b>
</marquee>
<marquee bgcolor=”black” style=”color: blue;” direction=”right” width=”130″>
<b>&lt;&lt; MACAM &gt;&gt;</b>
</span>
</marquee>
</div>

<< MACAM >>
<< MACAM >>

 

Kombinasi marquee dapat dilakukan dengan menggabungkan beberapa atribut sekaligus. Anda sudah mengetahui dasar-dasar membuat marquee, silahkan mengkreasikan marquee Anda sendiri.

Terima kasih telah membaca artikel “Cara Membuat Tulisan Berjalan Menggunakan HTML Marquee Di Blogger”. Jika ada pertanyaan, silahkan sampaikan di kotak komentar.

0 0
Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleppy
Sleppy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %

Cara Membuat Tulisan Berjalan di Website

Read Time4 Minute, 42 Second

Belajar SEO – Mungkin kita sering melihat running text / tulisan berjalan baik itu berada dibawah layar TV atau media media lainnnya yang seakan-akan untuk maksud mengalihkan fokus pengunjung website kita agar dia beralih fokus ke arah tulisan berjalan di dalam postingan atau website kita.  Dalam dunia blog dikenal dengan nama <marque>, karena menggunakan kode bahasa HTML itu sendiri.

Ada banyak model tulisan berjalan dari “bahan” marque yang bisa kita buat dengan sangat gampang, karena memang sudah disiapkan oleh bahasa HTML itu sendiri. Jika anda ingin mencoba “membuat tulisan berjalan” silahkan simak caranya dibawah ini :

 

1. Kode basic marquee untuk membuat tulisan berjalan adalah :

<marquee>TULISAN BERJALAN</marquee>

Hasilnya :
BELAJAR SEO
Kode diatas merupakan bentuk kode dasar, diperlukan tambahan kode lain kalau menginginkan varisai gerak lainnya dari sebuah marquee.

 

2. Kode loop=”angka|-1|infinite”

Kode ini biasa dipergunakan untuk melakukan pengaturan proses pengulangan sebuah marquee.

Contoh perintah kode marquee :

<marquee loop=”5″>MARQUEE AKAN BERPUTAR 5 KALI LALU MENGHILANG</marquee>

Hasilnya :
MARQUEE AKAN BERPUTAR 5 KALI LALU MENGHILANG

 

MARQUEE AKAN BERPUTAR 5 KALI LALU MENGHILANG

3. Kode scrolldelay=”angka”

Kode ini biasa dipergunakan untuk mengatur waktu delay selama “angka”, jadi kalau ingin menunda delay selama 1 detik maka andaa dapat merubah “angka” menjadi 1000, atau bila mau 0.5 detik maka diganti dengan 500.

Contoh perintah marquee :

<marquee scrolldelay=”500″>TEKS BERJALAN DAN DELAY SELAMA 0.5 DETIK</marquee>

Hasilnya :
TEKS BERJALAN DAN DELAY SELAMA 0.5 DET

 

4. Kode bgcolor=”warna”

Kode ini biasa digunakan untuk mengatur warna background tulisan berjalan. “warna” dapat diganti menggunakan bahasa inggris yang menyatakan jenis warna.

Contoh perintahnya :

<marquee bgcolor=”yellow”>TEXT DENGAN BACKGROUND KUNING</marquee>

Hasilnya :
TEXT DENGAN BACKGROUND KUNING

 

5. Kode scrollamount=”angka”

Kode ini biasa dipergunakan untuk mengatur kecepatan gerakan tulisan berjalan. Semakin besar “angka” semakin cepat juga gerakan nya.

Contoh perintah :

<marquee scrollamount=”10″>Kecepatan Tulisan berjalan 10</marquee>

Hasilnya :
Kecepatan Tulisan berjalan 10

 

6. Kode direction=”left/right/up/down”

Kode ini biasa dipergunakan untuk mengatur arah gerakan tulisan sesuai yang di inginkan.

Contoh perintah :

<marquee direction=”right”>TEKS BERJALAN KE KANAN</marquee>
<marquee direction=”up”>TEKS BERJALAN KE ATAS</marquee>

Hasilnya :
TEKS BERJALAN KE KANAN
TEKS BERJALAN KE ATAS

 

7. Kode width=”lebar”

Kode ini biasa dipergunakan untuk mengatur lebar media yang akan menampung marquee.

Contoh Perintah :

<marquee width=”50%”>LEBAR MEDIA 50 %</marquee>

Hasilnya :
LEBAR MEDIA 50 %

 

8. Kode title=”pesan”

Kode ini biasa dipergunakan untuk menampilkan suatu pesan jika kursor mouse didekatkan pada jalur teks

Contoh perintah :

<marquee title=”PESAN DI SINI”>MARQUEE berisi pesan tertentu</marquee>

Hasilnya :
MARQUEE berisi pesan tertentu

 

9. Kode behavior=”scroll/slide/alternate”

Kode ini viasa dipergunakan untuk mengatur jenis gerakan, yaitu :

  • Scroll bila ingin text berjalan terus ke salah satu sisi
  • Slide jika ingin text berjalan tersendat-sendat
  • Alternate jika mau text berjalan seperti memantul

Contoh perintah :

<marquee behavior=”scroll”>MARQUEE BERGERAK KE SISI</marquee>
<marquee behavior=”slide”>MARQUEE BERGERAK TERSENDAT</marquee>
<marquee behavior=”alternate”>MARQUEE MEMANTUL</marquee>

Hasilnya :
MARQUEE BERGERAK KE SISI
MARQUEE BERGERAK TERSENDAT
MARQUEE MEMANTUL

 

10. Kode onmouseover=”thsi.stop()” onmouseout=”this.start()”

Kode ini biasa dipergunakan kalau menginginkan tulisan berhenti bergerak kalau ada mouse yang mengenainya.

Contoh perintah :

<marquee behavior=”alternate” onmouseover=”this.stop()” onmouseout=”this.start()”>TULISAN BOLAK BALIK</marquee>

Hasilnya :
TULISAN BOLAK BALIK
 

 

11. Membuat link pada tulisan berjalan

<marquee behavior=”alternate” onmouseover=”this.stop()” ⇒ onmouseover=”this.stop()” onmouseout=”this.start()”><a https://belajarseo.net/pengertian-dasar-seo-macam-jenis-seo-dan-kegunaan-seo/”>PENGERTIAN DASAR SEO, MACAM JENIS SEO DAN KEGUNAAN SEO (BELAJAR SEO)</a></marquee>

Pengertian Dasar SEO, Macam Jenis SEO, Dan Kegunaan SEO (PENGETAHUAN SEO)

CARA MEMASANG KODE <marquee> PADA BLOG

&;nbsp

Setelah belajar dan mengetahui model – model penerapan kode marquee, lalu cara selanjutnya adalah mengetahui cara memasangnya di blog anda. Ada dua jenis tempat yang dapat dipergunakan untuk mkemasang kode tersebut, yaitu pada widget dan postingan.
&;nbsp

Baca selengkapnya :

1.  Memasang kode di widget

  •  Klik tambahkan Gadget
  • Pilih Gadget HTML marquee
  • Masukan kode marquee yang ingin anda buat di dalam konten tersebut
  • Simpan

2.Memasang kode di dalam postingan

  • Pada kolom postingan , klik mode HTML
  • Masukan kode HTML marquee
  • Klik mode compose untuk kembali melanjutkan postingan lainnya

3. Memasang code di dalam template

  • Lakukan pasrse kode HTML marquee terlebih dahulu
  • Klik menu template pada dashboard
  • Klik edit HTML
  • Letakkan kode HTML marquee yang sudah anda parse pada posisi yang anda ingin tampilkan
  • Save template

 

CARA MENAMBAHKAN WARNA, UKURAN HURUF, JENIS HURUF PADA TULISAN BERJALAN MARQUEE

Dengan cara menambahkan beberapa kode lagi maka akan dilakukan perubahan terhadap jenis huruf, ukuran dan warna teks berjalan <marquee>

Contoh kode :

style=”font-family:arial; font-size:20px; color:#ffffff;”

font-family:arial; –> kode untuk mengubah huruf menjadi jenis huruf arial

font-size:20px; –> kode untuk mengatur besar huruf

color#ffffff; –> kode untuk mengubah warna huruf

Contoh :

<marquee bgcolor=”blue” style=”font-family:arial; font-size:20px; color:#ffffff;”>TEKS BERJALAN WARNA LATAR BIRU</marquee>

hasilnya :
TEKS BERJALAN WARNA LATAR BIRU
 

Nah, tadi adalah cara membuat tulisan berjalan <marquee>, gaya diatas hanyalah sebagai contoh, masih banyak lagi model marquee yang dapat dibuat sesuai dengan kreatifitas anda.

Semoga artikel ini memberikan manfaat untuk anda. Terimakasih.

 

0 0
Happy
Happy
0 %
Sad
Sad
0 %
Excited
Excited
0 %
Sleppy
Sleppy
0 %
Angry
Angry
0 %
Surprise
Surprise
0 %