Cara Membuat Text Area di Blog

Apa itu Text Area? Sebenarnya juga bingung kalau mau njelasin, tapi intinya Text Area dalam dunia blogging bisa digunakan sebagai tempat untuk menampilkan script di postingan. Selain itu, penggunaan Text Area juga memudahkan para pengunjung untuk meng-copy script yang sobat sediakan. Yang perlu sobat ketahui, bahwasannya Text Area juga bisa ditampilkan di postingan ataupun di widget blog.
Untuk memudahkan sobat memahami tentang Text Area, berikut adalah kode dasar atau standar untuk membuat text area:

Klik dua kali untuk mengcopy

<textarea>isi dari teks area</textarea>

Dan hasilnya akan seperti ini:

isi dari teks area

Untuk lebih lengkapnya, sobat bisa lihat macam-macam Teks Area di bawah ini:

# Cara Membuat Teks Area Biasa

Klik dua kali untuk mengcopy

<textarea name="code" rows="2" cols=35">Masukkan teks/kode disini !!</textarea>

Hasilnya akan seperti ini:
Masukkan teks/kode disini !!

# Cara Membuat Text Area dengan Blok dalam Sekali Klik

Klik dua kali untuk mengcopy

<textarea rows="2" cols="35" onclick="this.focus(); this.select();">Coba klik teks ini !!</textarea>

Hasilnya akan seperti ini:
Coba klik teks ini !!

# Cara Membuat Text Area Dengan Tombol Highlight

Klik dua kali untuk mengcopy

<form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All"/>
<p align="center"><textarea style="WIDTH: 200px; HEIGHT: 100px" name="txt" rows="100" wrap="VIRTUAL" cols="55">
Masukkan text / script yang diinginkan di sini
</textarea></p></div></form>

Hasilnya akan seperti ini:

Masukkan text / script yang diinginkan di sini

# Cara Membuat Text Area Terblok Semua saat Disorot Mouse

Klik dua kali untuk mengcopy

<form name="Tirta Mubien"><div align="center" style="margin-bottom: 0pt; margin-top: 0pt;">
<textarea cols="55" name="txt" onmouseover="this.form.txt.select()" rows="100" style="height: 50px; width: 300px;">
coba arahkan mouse ke teks ini !!
</textarea></div></form>

Hasilnya akan seperti ini:

coba arahkan mouse ke teks ini !!

# Cara Membuat Text Area Dengan Border

Klik dua kali untuk mengcopy

<div align="center"><textarea cols="35" rows="2" style="border: 2px dotted red ;">Tulis apa aja deh.. terserah !!</textarea></div>
Hasilnya akan seperti ini:

Tulis apa aja deh.. terserah !!

Keterangan tentang Script Text Area di Atas :

1. Jika ada kode  <div align="center">, berarti lokasi text area-nya berada di rata tengah. Sobat  bisa mengganti "Center" menjadi "Left" atau "Right" sesuai keinginan sobat.
2. Kode cols="35" berarti jumlah karakter yang ditampilkan perbaris adalah 35.
3. Kode rows="2" berarti jumlah baris yang akan ditamplkan oleh text area adalah 2 baris. Jika jumlah baris lebih panjang dari yang disediakan maka text area akan menampilkan scrolling.
4. Jika ada kode Height:100px ,berarti kode tersebut menyatakan tinggi text area.
5. Jika ada kode Width : 200px, berarti kode tersebut menyatakan lebar text area.
6. Sobat juga bisa menambahkan kode readonly="" jika ingin text area yang sobat buat tidak bisa dihapus.

# Script Text Area Yang Tidak Bisa Dihapus

Klik dua kali untuk mengcopy

<div align="center"><textarea rows="2" cols="35" onclick="this.focus(); this.select();" readonly="">Coba hapus teks di text area ini apa terhapus?</textarea></div>

Hasilnya:

Coba hapus teks di text area ini apa terhapus?

Nah bagaimana nih, sobat pastinya sudah paham kan tentang cara menambahkan text area di blog? Berhubung sudah capek ngetik karena panjang banget, buat sobat yang masih bingung silakan tinggalkan komentar di bawah postingan ini :)
Sampai jumpa di postingan selanjutnya dan salam blogger :)