HTML Addicted: Text Area di Sidebar

Memang benar. Ilmu tidak pantas kalau dipendam sendiri. Sebelum saya memberikan tutorial ini, dengan bangga saya sampaikan kalau saya belajar dari http://annunaki.wordpress.com/2010/07/14/cara-membuat-text-area-di-wordpress-com/. Terima kasih banyak buat Bang Red atas ilmunya.

HTML code

HTML code

Tentunya teman-teman semua sudah melihat widget yang ada di sidebar blog saya. Di situ ada dua widget yang bisa di-scroll. Apa namanya? Saya menggunakan TEXT AREA.

Text Area ini sangat berguna di blog kita, terutama untuk efisiensi tempat. Kok bisa? Text Area punya lebar (width) dan tinggi (height) yang kita definisikan. Jika materi di dalam text area tersebut melebihi kapasitasnya, maka otomatis scroll bar akan muncul.

Kebanyakan blogger menggunakan text area untuk menempatkan blogroll. Dan tentunya fungsinya tidak sebatas itu, teman-teman bisa menyesuaikan nya dengan kebutuhan blog teman-teman.

Well, nggak usah banyak cincong. Berikut panduannya jika teman-teman ingin pasang text area di sidebar WordPress.com:

  1. Masuk Dashboard
  2. Pilih Appearance > Widget
  3. Aktifkan widget Text ke dalam Sidebar (atau tempat widget lainnya)
  4. Isikan kodenya (kode ada di bawah)
  5. Ketikkan materi yang ingin dimunculkan di dalam text area
  6. Jangan lupa klik tombol Save

Nah kodenya seperti di bawah ini:

<div style="overflow: auto; width: 200px;
height: 100px; background-color: #c1eeec;
text-align: justify; padding: 5px;
border: 1px solid #999999;">...Tulis di sini materi yang ingin ditampilkan...</div>

Dan berikut keterangan tambahannya:

  • width: lebar text area
  • height: tinggi text area
  • background-color: warna background text area
  • text-align: alignment text area
  • padding: jarak tulisan dengan border text area
  • border: style border

::::: END of TUTORIAL :::::

Sekian tutorialnya, semoga bermanfaat!

Ada yang ingin ditanyakan?

Sumber gambar: HTML code

Iklan

13 thoughts on “HTML Addicted: Text Area di Sidebar

  1. sob.. sebenarnya gue juga newbie soal HTML ini. gue hanya memodifikasi dikit dari si pendekar wordpress.. bootingskoblog, karena dia make layanan wp.com yg dashboardnya bahasa inggris sedangkan banyak narablog indonesia memakai dashboard indonesia, makanya gue modif2 dikitlah2 😛

    sobat lambertus kunjungi blog dia supaya bisa jadi pendekar wp juga ehehehe
    buat newbie : http://bootingskoblog.wordpress.com/tutorial-wordpress-com/
    buat middle : http://bootingskoblog.wordpress.com/wordpresscom-widgets/
    buat advance : http://bootingskoblog.wordpress.com/wordpress-trick/

    blog oom booting itu banyak menginspirasi gue, meski themenya sederhana, tapi contentnya ciamik! dia juga membolehkan kita copy paste semua tulisannya dengan bebas, karena menurut beliau semua tutorial itu telah diberikan secara cuma-cuma oleh wp.com

    btw.. gue liad elu juga berkembang dengan memasukkan smiley di sidebar.. sesuatu yg tidak pernah terpikirkan olehku sebelumnya… mantap! sukses yah!

    • Hihihi iya iya. Saya ini sejak awal kecantol sama wp.com. Ga tau napa. Mungkin karena penggunaannya yang user friendly n tampilannya yg bagus n rapi. Makanya saya dengan senang hati muter2 n berbagi pengalaman tentang wp.com dengan pembaca semua. Dulu sempat lari ke blogspot lantaran di wp.com g bisa javascript, tapi akhirnya balik juga karena itu bukan kebutuhan utama saya dalam berblogging ria.

      Sehubungan dengan hal itu, saya berterima kasih atas referensi yg diberikan Bang Red. Pastinya saya jadi tau banyak sama hal-hal baru.

      Tentang code HTML text area ini, saya emang sudah bertekad buat lanjut nyalurin ilmunya di blog ini setelah sukses bikin. Bahasa yg saya gunakan emang sederhana banget. Kalau pembaca ingin yg lebih jelas lagi keterangannya, kan akhirnya bisa mampir ke blognya Bang Red. Makanya saya kasih link ntu yg ada di atas. N kalau saya jadi Bang Red, yg tutorial itu saya pasangi link ke blognya bootingskoblog, biar pembaca ga sulit muter2 nyari referensi.

      Smiley di sidebar itu juga saya terinspirasi dari blog2 yg ada fasilitas emoticon di atas kotak komentarnya. Tapi berhubung wp.com ga bisa instal plugin sendiri, ya akhirnya gambarnya saya pasang di sidebar biar bisa diakses dari mana-mana. Hihihi.. tapi ya maaf kalau harus nambahin kode <img src=”…”> dulu.

      Terakhir, Bang Red juga sudah menginspirasi saya lewat komentar2 yg “ada isinya” di blog ini. Makasih banget. Jangan sungkan2 buat sering main ke sini ya. (berkedok biar sering comment… hihihihi)

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s