google-site-verification: google7105ea3515502ea1.html gumregut: Cara Membuat Tulisan Berjalan Marquee Text Di Blog

Saturday, October 25, 2014

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!

47 comments:

  1. Mantaaap sob artikelnya :)
    Ijin share http://grosiracemaxstasik.com/obat-alami-diare/

    ReplyDelete
  2. Mantap artikelnya, terimkasih gan
    http://grosirobatjellygmat.com/
    http://obatjellygamatgoldg.net/
    http://jellygamat-gold.net/
    http://jamutradisionalmujarab.com/
    http://jellygamatgoldgpro.com/

    ReplyDelete
  3. Manteep sob artikelnya, sangat membantu :)
    Ijin share http://apotekherbalkita.com/obat-herbal-radang-tenggorokan/

    ReplyDelete
  4. nice artikelnya sangat bermanfaat sekali :)
    http://jellygamatgoldg31.com/

    ReplyDelete
  5. Nice guys artikelnya, thanks :)
    http://goo.gl/zqUU8t

    ReplyDelete
  6. Manteep dah sob untuk tutornya, sangat membantu :)
    http://goo.gl/m6kxdR

    ReplyDelete
  7. terimakasih kawan infonya, salam semangat !
    http://bit.ly/1GDl7wE

    ReplyDelete
  8. keren banget sob artikelnya, di tunggu artikrl yang lainnya
    Izin nyimak saja
    s.id/5PG

    ReplyDelete
  9. Makasih sob informasi artikelnya :)
    http://goo.gl/NcIh6Z

    ReplyDelete
  10. Terimakasih informasinya :)
    http://goo.gl/8yKBo1

    ReplyDelete
  11. Saya sudah masang, hasilnya baguuus :)
    http://goo.gl/S4oK7y

    ReplyDelete
  12. Kunjungi Blog Tiffany ^_^

    http://www.saranapokerinfo.com/2015/05/pada-tgl-6-mei-jepang-memperingati-hari.html
    http://tiffanychai05.blogspot.com/2015/05/agen-poker-wanita-ini-mengalami.html

    ReplyDelete
  13. Kunjungi Blog Saya ^_^

    http://www.saranapokerinfo.com/2015/06/demi-club-favoritenya-jurnalis-ini-rela.html
    http://tiffanychai05.blogspot.com/2015/06/agen-poker-gelandang-ac-milan-ini.html

    ReplyDelete
  14. wah mantab blognya, salam kenal ya brow..
    http://zakypotensi.blogspot.com

    ReplyDelete
  15. Terimakasih ya gan atas pengetahuanya, Salam kenal dan jangan lupa followbacknya gan,.,.

    ReplyDelete
  16. kalo tulisan bolak balik gimana ya cara bikinnya?
    internet marketing.

    ReplyDelete
  17. This comment has been removed by the author.

    ReplyDelete
  18. Tipsnya sangatlah bermanfaat ! THANK'S

    ReplyDelete
  19. KEREN GAN.. zn
    http://www.iso9001.co.id

    ReplyDelete
  20. KEREN GAN.. zn
    http://www.iso9001.co.id

    ReplyDelete
  21. mantap infonya gan...
    http://malangtoyota.blogspot.co.id/

    ReplyDelete
  22. klo di mix gmn caranya gan??? misalnya penambahan background dan klo di klik mouse berhenti teksnya

    ReplyDelete
  23. klo di mix gmn caranya gan??? misalnya penambahan background dan klo di klik mouse berhenti teksnya

    ReplyDelete
  24. klo di mix gmn caranya gan??? misalnya penambahan background dan klo di klik mouse berhenti teksnya

    ReplyDelete
  25. THANKS, ARTIKELNYA SANGAT MEMBANTU

    ReplyDelete
  26. artikel sangat membantu, terima kasih banyak ya kak ...
    izin share ya

    http://bit.ly/1MxAv3x

    ReplyDelete
  27. This comment has been removed by the author.

    ReplyDelete
  28. mantap gan jngan lupa mampir ke blog ane www.fahnik.com

    ReplyDelete
  29. mantap gan jngan lupa mampir ke blog ane www.fahnik.com

    ReplyDelete
  30. Gan kalau mengganti tulisannya gimana gan? biar ada variasinya?
    http://hasanwafa96.blogspot.co.id/

    ReplyDelete
  31. This comment has been removed by the author.

    ReplyDelete
  32. mantep artikelnya banyak membantu terimakasih

    ReplyDelete
  33. Maaf baru Bisa Nyempetin Waktu TUK Berkunjung,makasih dapat Ilmunya Semogah Mendapat keberkahan.AQmiin

    ReplyDelete
  34. Mantap gan info nya

    http://dg-pokerterpercaya.blogspot.com/
    https://beritabola39.blogspot.com/
    http://dewabookie.blogspot.com/
    http://beritametroline.blogspot.com/
    http://sukamuncrat.blogspot.com/
    http://sukabening39.blogspot.com/
    http://pasaranprediksi.blogspot.com/

    ReplyDelete
  35. keren gan, kunjungi juga http://www.online133.xyz

    ReplyDelete
  36. wah jadi nambah ilmu nih makasih gan,,buat artikelnya,,

    ReplyDelete