Cara Membuat Tulisan Berjalan Di Blog

Halo blogger mania, tutorial kali ini akan membahas, gimana sih caranya membuat tulisan berjalan di blog atau website? Tulisan berjalan ini, bisa juga membuat daya tarik tersendiri di blog kalian. Dulu, sebelum mengganti berbagai tamplate, aku juga pernah memasukan tulisan berjalan di blog. Tapi, sekarang belum bisa kukasih gegara masih suka gonta-ganti tamplate. 

Ok, kali ini aku akan kasih tau kalian tentang script berjalan ini menggunakan marquee dengan berbagai fariasi yang bisa dicoba di blog kalian masing-masing.


Baca Juga : 1. Cara Membuat Kotak Script Dalam Postingan Blog
                    2. Kode Warna HTML

Cara Membuat Tulisan Berjalan Di Blog

            1. Contoh Tulisan Berjalan Dari Kanan Ke Kiri

<marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan Dari Kiri Ke Kanan.Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)</marquee>

Hasilnya sebagai Berikut: 

Contoh Tulisan Berjalan Dari Kiri Ke Kanan.Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)

             2.   Tulisan Berjalan Dari Kiri Ke Kanan

<marquee direction="right" scrollamount="2" align="center">Contoh Tulisan Berjalan Dari Kiri Ke Kanan. Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)</marquee>

Hasilnya sebagai Berikut: 

Contoh Tulisan Berjalan Dari Kiri Ke Kanan. Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)

             3.    Tulisan Berjalan Dari Atas Ke Bawah

 <marquee direction="down" scrollamount="2" align="center">
Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)</marquee>

Hasilnya sebagai Berikut: 

Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)

            4.  Tulisan Berjalan Dari Bawah Ke Atas

<marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan Dari Bawah Ke Atas. Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)  </marquee>

Hasilnya sebagai Berikut: 

Contoh Tulisan Berjalan Dari Bawah Ke Atas. Jika kalian menggunakan kode di atas, maka hasil jadinya akan seperti tampilan ini. www.zhiangzieyie.com (Jemari Go Blog)

            5. Tulisan Berjalan Bolak Balik Dari Kiri Ke Kanan

<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> www.zhiangzieyie.com (Jemari Go Blog) </marquee>

Hasilnya sebagai Berikut:

www.zhiangzieyie.com (Jemari Go Blog)

           6. Tulisan Berjalan Bolak Balik Dari Kanan Ke Kiri   

<marquee direction="right" scrollamount="2" align="center" behavior="alternate">www.zhiangzieyie.com (Jemari Go Blog)</marquee>

Hasilnya sebagai Berikut:

www.zhiangzieyie.com (Jemari Go Blog)

          7. Tulisan Berjalan Dengan Link

<marquee align="center" direction="left" scrollamount="6"><a href="http://www.zhiangzieyie.com/">www.zhiangzieyie.com (Jemari Go Blog)</a></marquee>

Hasilnya sebagai Berikut:

www.zhiangzieyie.com (Jemari Go Blog)

          8. Tulisan Berjalan Dari Bawah Ke Atas Dengan Link Tapi Jika Disentuh Tulisan Akan Berhenti

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href="#">Cara Membuat Tulisan Berjalan Di Blog</a><br/>
<a href="http://www.zhiangzieyie.com/">Jemari Go Blog</a><br/>
<a href="https://plus.google.com/+ZHIANGZIEYIE">Blognya Babu Hongkong</a><br/>
</marquee>

Hasilnya sebagai Berikut:

Cara Membuat Tulisan Berjalan Di Blog

Jemari Go Blog
Blognya Babu Hongkong

          9. Tulisan Berjalan Dalam Kotak Script.

<div style="background: Blue; border: 2px solid Black; color: white;">
<marquee align="center" direction="left" scrollamount="6">www.zhiangzieyie.com (Jemari Go Blog)</marquee>

</div>

Jika Kalian Menggunakan Script Di Atas, Maka Hasilnya Akan Seperti Kotak Ini

www.zhiangzieyie.com (Jemari Go Blog)

Lalu bagaimana cara untuk menempatkan tulisan berjalan di Widget Blog?

1. Seperti biasa masuk akun Blog Kalian
2. Pilih Loyaut / Tata Letak ==> Tambahkan elemen/ Widget ==> Pilih HTML Jave Script.
3. Masukan Kode Marquee yang ingin kalian tambahkan di widget.
4. Terakhir, klik Save dan lihat hasilnya.

Catatan :

- Direction : Gunanya untuk mengatur pola gerakan teks (left, right, up dan down)
- Behavior ( scroll/slide/alternate ): untuk mengatur prilaku gerakan.
- Untuk menambahkan background, padding, border, color, dll pada marquee, silahkan sisipkan kode marquee antara kode berikut
- Scrollamount : untuk mengatur kecepatan gerakan teks. Naikkan angkanya ( dari 2 menjadi 3 ) untuk mempercepat gerakan dan sebaliknya.
- Untuk tulisan yang berwarna merah kalian bisa menggantinya sesuai tulisan yang kalian inginkan,

- Untuk tulisan yang ditandai dengan <a href="https://plus.google.com/+ZHIANGZIEYIE"> Kalian bisa menggantinya dengan link tujuan yang kalian inginkan.

Segini dulu buat hari ini, nanti jika ada tambahan bakal aku update lagi. Jika dirasa tulisan ini bermanfaat jangan lupa tinggalkan jejak, add G+Plus dan Like FansPage Blog&Desain Tutorial. Terima kasih sudah berkunjung.