CARA MENDESAIN BLOG

                                    CARA MENDESAIN BLOG AGAR TAMPAK KEREN

       iNI tentang pengalaman saya waktu membuat blog... ada satu persyaratan untuk melihat postingan ini jangan hanya mengcopypaste/copas


Yang pertama 



  1. Cara Membuat Teks Bergerak di Blog

    Cara Membuat Teks Bergerak di Blog – Cara menjadikan teks di blog bergerak atau cara membuat teks marquee.
    Tulisan Berjalan
    Cara membuat teks bergerak merupakan salah satu langkah desain blog yang biasanya dilakukan untuk tek-teks atau kalimat-kalimat yang penting, misalnya ucapan selamat datang, iklan atau judul bagian-bagian tertentu dari blog. Baca juga artikel untuk mempercantik dan mendesain blog berikut: cara membuat judul widget berada di tengah sidebar. Oke, kembali ke permasalahan, Sering kali kita melihat blog yang dihiasi oleh tulisan atau kata-kata yang berjalan di blog teman-teman kita. mungkin sebagian besar sudah mengetahuinya. tapi disini ade mencoba untuk sharing kepada teman-teman yang belum mengetahui cara pembuatannya.

    Note: yang akan saya bahas ini merupakan tulisan berjalan biasa bukan tulisan berjalan yang apabila ada mouse di area tulisan itu akan berhenti.

    berikut cara menjadikan teks di blog bergerak:
    1. Login ke Blogger.
    2. Klik Tata Letak.
    3. Ketika sudah berada di Elemen Halaman klik Tambah Gadget.
    4. Lalu pilih HTML/JavaScript.
    5. Langkah selanjutnya masukkan kode marquee yang anda inginkan seperti contoh dibawah ini:

    1. Teks berjalan dari kanan ke kiri


    Kode:
    <marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>
    Hasil:

    Contoh Tulisan Berjalan

    2. Teks berjalan dari kiri ke kanan

    Kode:
    <marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
    Hasil:

    Contoh Tulisan Berjalan 

    3. Teks berjalan bolak balik

    Kode:
    <marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
    Hasil:
     Contoh Tulisan Berjalan 

    4. Teks berjalan dari atas ke bawah

    Kode:
    <marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

    Hasil:

     Contoh Tulisan Berjalan 5. Teks berjalan dari bawah ke atas

    Kode: 
    <marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

    Hasil:

    Contoh Tulisan Berjalan6. Teks berjalan mondar-mandir

    Kode:
    <marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

    Hasil:

    Contoh Tulisan Berjalan7. Teks berjalan zig-zag nembus

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

    Hasil:













    Contoh Tulisan Berjalan
    8. Teks berjalan zig-zag mantul

    Kode: 
    <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
    Langkah Selanjutnya adalah mengganti tulisan
    Contoh Tulisan Berjalan
    dengan tulisan atau kata-kata yang anda inginkan.

    Ket :
    # direction="left/right/up/down" --> Mengatur arah gerakan teks.

    # scrollamount="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semakin cepat gerakannya.

    # behavior="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan :
    ~> Scroll --> teks bergerak berputar
    ~> Slide--> teks bergerak sekali lalu berhenti
    ~> Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)

    # Fungsi dari :
    <center> ............. </center>

    Cara Membuat Tulisan Berjalan (Marquee)

    Cara Membuat Tulisan Berjalan (Marquee)
    Bagaimana cara membuat tulisan berjalan? Tulisan atau teks berjalan atau running textini biasa juga kita sebut marquee, karena untuk membuatnya menggunakan kode marquee. Tulisan ini bisa membuat blog anda terlihat lebih menarik bagi pengunjung.

    Untuk membuat tulisan berjalan atau Marquee ini sebenarnya sangat mudah. Kali ini kita akan mencoba membuat beberapa jenis marquee, agar lebih banyak variasi yang bisa anda pilih. Terlebih dulu kita akan belajar membuat kodenya, lalu belajar cara memasangnya pada blog....

    Kode dasar untuk membuat marquee atau teks berjalan adalah....
     <marquee>TULISAN YANG AKAN BERGERAK</marquee>

    Kode di atas akan terlihat seperti ini:
    TULISAN YANG AKAN BERGERAK
     
    Tapi selain kode di atas ada beberapa tambahan kode yang bisa anda berikan untuk membuat variasi dari marquee. Di bawah ini kita akan berikan kodenya dan sekaligus mempraktikkan marquee tersebut....

    kode scrolldelay="angka" digunakan untuk mengatur jeda dalam milidetik, jadi untuk jeda 1 detik masukkan nilai 1000
    Contoh kode marquee:
    <marquee scrolldelay="500">RUNNING TEKS DELAY 0,5 DETIK</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    RUNNING TEKS DELAY 0,5 DETIK

    kode loop="angka|-1|infinite" digunakan untuk mengatur pengulangan atau repetisi dari marquee
    Contoh:
    <marquee loop="3">MARQUEE BEROTASI 3 KALI SAJA</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    MARQUEE BEROTASI 3 KALI SAJA
    Keterangan: Setelah 3 kali teks akan hilang.

    kode width="lebar" digunakan untuk mengatur lebar media teks berjalan, bisa dalam satuan pixel atau persen dari bidang yang ada
    Contoh kode:
    <marquee width="50%">MARQUEE LEBAR 50 PERSEN</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    MARQUEE LEBAR 50 PERSEN

    kode bgcolor="warna" digunakan untuk memberikan warna latar pada marquee jika diperlukan
    Contoh kode marquee:
    <marquee bgcolor="yellow">RUNNING TEXT LATAR KUNING</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    RUNNING TEXT LATAR KUNING


    kode title="pesan" digunakan untuk memunculkan pesan jika kursor mouse diletakkan di jalur teks berjalan
    Contoh kode:
    <marquee title="BISA TERBACA PESANNYA">TEKS BERJALAN DENGAN PESAN</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    TEKS BERJALAN DENGAN PESAN
    Keterangan: Taruh kursor mouse pada jalur dan bukan pada teks untuk membaca pesan

    kode scrollamount="angka" digunakan untuk mengatur kecepatan pergerakan tulisan semakin besar angkanya semakin kencang
    Contoh kode:
    <marquee scrollamount="14">MARQUEE SPEED 14!!!</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    MARQUEE SPEED 14!!!

    kode direction="left/right/up/down" digunakan untuk mengatur arah pergerakan running text
    Contoh kode:
    <marquee direction="right">MARQUEE BERGERAK KE KANAN</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    MARQUEE BERGERAK KE KANAN

    kode behavior="scroll/slide/alternate" digunakan untuk mengatur type pergerakan
    Scroll jika ingin teks bergerak terus ke suatu sisi dan muncul dari sisi lain
    Slide jika ingin teks bergerak sekali kemudian berhenti dan diulangi lagi
    Alternate jika ingin teks terlihat memantul/bouncing dari ujung kembali ke ujung.
    Contoh kode:
    <marquee behavior="alternate">MARQUEE BERGERAK BOLAK-BALIK</marquee>
    Hasilnya akan terlihat seperti di bawah ini:
    MARQUEE BERGERAK BOLAK-BALIK
      Sekarang kita akan coba membuat variasi dari kode di atas. Kita akan membuat teks ini bergerak turun dan oleh karena itu kita perlu menambah kode height untuk membuat ruang pergerakan teks;
      Contoh kode:
      <marquee direction="down" height="100">MARQUEE BERGERAK KE BAWAH</marquee>
      Hasilnya...
      MARQUEE BERGERAK KE BAWAH

      Lalu bagaimana caranya membuat tulisan ini berhenti jika dilintasi kursor mouse?
      Mudah, silahkan tambahkan kode
      onmouseover="this.stop()" onmouseout="this.start()"
      Contoh kodenya seperti berikut:
      <marquee behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()">MARQUEE BERGERAK BOLAK-BALIK</marquee>
      Tampilan akhir akan terlihat seperti berikut....
      MARQUEE BERGERAK BOLAK-BALIK
      Keterangan: Silahkan lintaskan kursor pada jalur ataupun teks untuk menghentikan pergerakan

      Bisakah Marquee diberi link? 
      Tentu saja, sebagai contoh lihat kode berikut:
      <marquee direction="down" height="100" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">
      <a href="http://trikmudahseo.blogspot.com/2012/09/cara-membuat-tulisan-berjalan-marquee.html">CARA MEMBUAT TULISAN BERJALAN (MARQUEE)</a>
      </marquee>  
      Tampilan akhir akan terlihat seperti berikut....

      CARA MEMBUAT TULISAN BERJALAN (MARQUEE)


      Demikianlah berbagai ragam cara untuk membuat teks berjalan. Mudah-mudahan ini bisa menjadi alternatif bagi anda dalam menghias blog menjadi lebih menarik. Silahkan bereksperimen untuk meramu kode-kode di atas.

      Lalu bagaimana cara memasang kode-kode ini?
      Saudara bisa memasang kode yang sudah dibuat pada dua tempat, yaitu widget dan artikel:
      Untuk memasang pada widget silahkan ikuti langkah berikut:
      • Buka menu Tata Letak / Layout
      • Klik Tambah Gadget
      • Pilih gadget HTML/JAVASCRIPT
      • Masukkan kode yang sudah dibuat
      • Simpan perubahan pada gadget
      Untuk memasang pada artikel ikuti langkah berikut:
      • Saat menulis artikel masuk ke mode HTML
      • masukkan kode HTML marquee saat berada di mode ini
      • Kembali ke mode Compose untuk melihat apakah posisi teks sudah benar
      • Klik PRATINJAU untuk melihat versi web aktif
      Ok, sekarang anda sudah tahu cara membuat dan memasangnya. Berarti saudara sudah bisa bereksperimen sendiri untuk menghias blog menjadi lebih menarik.... Jadi sekian dulu artikelnya, terima kasih sudah mampir...

    CARA MENDESAIN BLOG 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.
    Share 'CARA MENDESAIN BLOG' On ...

    Ditulis oleh: Az'han Satria.Yudha - Saturday, 16 February 2013

    Belum ada komentar untuk "CARA MENDESAIN BLOG"

    Post a Comment

    Berkomentar Dengan sopan Komentar Anda Akan Kami Moderasi terlebih Dahulu Sebelum Diterbitkan