
Khusus untuk arahan ataupun script yang ingin teman tampilkan ke dalam text area, teman perlu meng-encode terlebih dahulu arahan atau script html tersebut biar tampilannya dalam text area tersebut cuma dan hanya berbentuk goresan pena saja. Silahkan teman lihat teladan dari penggunaan text area di bawah ini yang mungkin sudah sering teman lihat pada blog maupun situs yang lain dikala browsing internet.
Variasi Text Area Pada Blog
Cukup banyak model dari text area ini yang sering dipakai pada blog. jadi silahkan pilih sendiri text area yang cocok bagi teman sekalian.
1. Text Area Dengan Tampilan biasa
<textarea>deskripsi teks anda disini</textarea>
Tampilannya akan menyerupai ini :
2. Text Area Dengan Tampilan Border & Background
<div style="border: 3px dashed rgb(245, 0, 61); padding: 5px; background: rgb(255, 255, 204) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">Tulisan deskripsi yang ingin teman tampilkan disini</div></blockquote>
Tampilannya akan menyerupai ini :
Tulisan deskripsi yang ingin teman tampilkan disini
3. Text Area Dengan Tombol Highlight
<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All"> </div><div align="center"></div><p align="center><textarea style="WIDTH: 200px; HEIGHT: 100px" name="txt" rows="100" wrap="VIRTUAL" cols="55">Tambahkan teks yang diinginkan disini. Jika teks terlalu panjang, maka akan memunculkan scroll secara otomatis dalam text area sehingga membantu pembaca blog dalam mengcopy goresan pena ataupun script yang diperlukan</textarea></p></div></form>
Tampilannya akan menyerupai ini :
Keterangan : - center mengatakan letak dari tombol highlight all, ganti dengan "left" kalau letaknya di kiri teks atau "right" bila letaknya di kanan teks.
- Highlight All silahkan ganti dengan yang teman inginkan pada goresan pena tombolnya.
- WIDTH: 200px menunjukkan ukuran lebar dari text area, silahkan ubah sesuai impian sobat.
- HEIGHT: 100px menunjukkan ukuran tinggi dari text area, ubah sesuai keperluan.
- 100 menunjukkan jumlah baris didalam text area, ubah kalau diharapkan atau biarkan secara default.
- 55 menunjukkan jumlah aksara yang ditampilkan per barisnya, ubah sesuai impian teman atau biarkan secara default.
4. Teks Area Dengan Tulisan Terblok Saat Diklik
<div align="center">
<textarea rows="4" cols="35" onclick="this.focus(); this.select();">Tambahkan teks yang diinginkan disini. Jika teks terlalu panjang, maka akan memunculkan scroll secara otomatis dalam text area sehingga membantu pembaca blog dalam mengcopy goresan pena ataupun script yang diperlukan</textarea></div>
Tampilannya akan menyerupai ini :
5. Teks Area Terblok Secara Otomatis Saat Disorot Mouse
<div><form name="BlockbyMouse"><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;">Silahkan sorot teks dengan mouse teman disini</textarea</div></form></div>
Tampilannya akan menyerupai ini :
