Apr 26, 2012

Cara Membuat Teks Area dan Variasi Text Area

Untuk apa sih teks area itu, selain untuk kerapian posting blog juga bermanfaat untuk menghemat halaman agar tidak terlalu penuh. Selain itu terkadang kita dalam mengcopy paste kode tertentu terkadang keluar jalur alias melewati batas area artikel blog. Hal tersebut terjadi karena kita cuma memasukkan kode-kode tersebut ke dalam blockquote. Nah disnilah fungsi utama dari teks area tersebut. 

Pada kesempatan ini saya akan memberikan 3 variasi teks area. yaitu text area sederhana / default, text area dengan fungsi select / copy all, dan text area dengan tombol scroll / gulir.
Cara memasang teks area ini adalah pada saat menulis postingan pilih menu HTML (bukan edit HTML template loh yaah). Lihat gambar. 

cara membuat teks text area di blog
Masukkan kode text area setelah klik HTML

A. Teks area sederhana

 <textarea rows="6" cols="35">diisi dengan kalimat, kata, kode yang diinginkan</textarea>


dengan kode di atas maka tampilan teks area seperti di bawah ini. angka 6 berarti jumlah baris, 35 menunjukkan lebar form teks area.




B. Teks Area dengan Select copy all







Kode diatas adalah cara membuat dengan text area dengan perintah / fungsi select / copy all

silakan sobat atur letaknya center artinya posisi text area ditengah, height > tinggi nya, width > lebar form teksnya.




C. Membuat Teks area dengan Tombol scroll


<div style="overflow:auto; width:80%px; height:50px; padding:10px; border:2px solid #f4f4f4; background-color:#f2f2f2">
Cara membuat text area dengan fungsi scroll / tombol gulir
</div>
Beginilah tampilannya jika menggunakan kode diatas, silakan sesuaika background color dengan template sobat masing-masing. Intinya kode merah adalah silakan modifikasi sendiri.


Cara membuat text area dengan fungsi scroll / tombol gulir


Demikian cara membuat teks area dalam postingan blog. Nah, bagaimana sobat, terserah anda mau pilih yang mana yang terbaik. silakan dicoba. Salam Blogger.

13 comments:

  1. Kalo aku lebih suka make yg prtama.

    ReplyDelete
  2. Trima Kasih ya Jadi tau Nih, Kunjungi Blog saya juga : http://ayosebarin.blogspot.com

    ReplyDelete
  3. sangat membantu saya, saya sudah peraktekkan yang no 2 di blog saya
    thanks

    ReplyDelete
  4. Terima kasih atas infonya sekarang blogku ada Facebook di
    tamin-putra-news.blogspot.com

    ReplyDelete
  5. Membuat text area, tips trik yang mantap, saya banyak terbantukan, salam kenal persahabatan

    ReplyDelete
  6. Inilah tips trik yang saya cari, sangat bermanfaat, terima kasih telah sudi untuk berbagi. Btw, sukses follow di #235.

    ReplyDelete
  7. Model-model text area yang mantap mas bro, dapat dijadikan bahan rujukan, thanks for sharing. Sukses follow di urutan #236.

    ReplyDelete
  8. Lumayan lengkap tutorialnya, makasi sob....

    ReplyDelete
  9. Macam-macam model text area yang mantap, thanks for sharing

    ReplyDelete

Anda harus menjadi follower blog ini jika ingin memberikan komentar. Terima Kasih