Cara Menciptakan Textarea

Untuk menciptakan text area aku rasa sudah banyak blogger yang tahu, tapi mungkin saja ada yang sudah lupa atau memang belum tahu membuatnya. Oleh alasannya yakni itu, kali ini aku akan sedikit share perihal cara menciptakan text area,  sebelumnya sudah aku publish mengenai text area untuk link postingan. Text area yakni suatu form yang disediakan untuk menulis arahan HTML supaya sanggup ditampilkan di halaman posting atau di sidebar untuk banyak sekali keperluan, menyerupai menciptakan artikel, menciptakan LinkExchange, dll. Lihat postingan sebelumnya Cara Menampilkan Kode HTML.

        Textarea dibutuhkan dalam pembuatan blog atau website ketika menciptakan text atau goresan pena di dalam box. Hasil penulisan text di dalam Textarea tersebut akan ditulis tanpa merubah ukuran dari texarea itu sendiri (sebelumnya char width (cols) dan rows didefinisikan terlebih dahulu). Apabila text yang ditulis melebihi kapasitas ukuran textarea, maka textarea tersebut akan otomatis menciptakan scrollbar di sebelah kanan.
Dalam text area, penulisan arahan HTML dan CSS, atau script lain sanggup ditulis tanpa perlu memakai entitas HTML atau dengan kata lain seluruh text, kode, dan script yang ditulis pada textarea akan tampil apa adanya sehabis diposting.
Para blogger biasanya memakai textarea sebagai daerah untuk menyimpan arahan HTML, CSS, atau script yang lain contohnya url download, script tukar link, script banner exchange, dan lain-lain. Berikut ini akan aku jelaskan cara menciptakan textarea pada blog jikalau suatu ketika dibutuhkan untuk menempatkan atau menyimpan arahan HTML. Cols berfungsi untuk mendefinisikan jumlah huruf ke samping yang akan ditampilkan pada textarea, Rows berfungsi untuk mendefinisikan jumlah baris pada textarea.

Contoh 1 :

Penulisan text di dalam textarea dengan ukuran char width 40 dan jumlah baris 4 :

Penulisan arahan HTML :

<textarea cols="40" rows="4">Tulisan ini berada didalam textarea </textarea>

Tampilan sehabis diposting : 

Tulisan ini berada didalam textarea

 
Contoh 2 :

Penulisan text di dalam textarea dengan ukuran char width 40 dan jumlah baris 4 tetapi goresan pena melebihi kapasitas textarea:

Penulisan arahan HTML :

<textarea cols="40" rows="4">Tulisan ini ada di dalam textarea dengan ukuran char width 40 dan jumlah baris 4, perhatikan penulisan ini akan melebihi batas textarea sehingga secara otomatis akan tampil scrollbar di sebelah kanan. Untuk membaca sisa text yang tidak terlihat sanggup dengan menggeser scrollbar tersebut.</textarea>

Tampilan sehabis diposting :

Tulisan ini ada di dalam textarea dengan ukuran char width 40 dan jumlah baris 4, perhatikan penulisan ini akan melebihi batas textarea sehingga secara otomatis akan tampil scrollbar di sebelah kanan. Untuk membaca sisa text yang tidak terlihat sanggup dengan menggeser scrollbar tersebut.

Cara Membuat Text Area dengan Tombol  "Select All" Button

cara menciptakan text box area, "select all" button pada text area atau text box area.
Text area yang terdapat tombol "Select All" yakni area atau daerah yang dibentuk untuk menyimpan goresan pena baik berupa text maupun berupa arahan HTML/Javascript yang akan memudahkan pembaca dalam melaksanakan copy-paste hanya dengan sekali klik pada button Select All, seluruh text didalam text area eksklusif sanggup ter-copy.
Perhatikan kedua pola berikut :

Contoh 1. Text Area Tanpa Select All Button:

Untuk menciptakan textarea yang ketika diklik goresan pena dalam textarea akan eksklusif terpilih semua (HighLight) tanpa memakai tombol bantu select all, maka gunakan arahan berikut ini :

<p align="left"><textarea name="code" rows="4" cols="40" onclick="this.focus();this.select();">Isi dengan goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript.</textarea></p>

Ganti tulisan"Isi dengan goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript  yang Anda miliki. Klik publish dan lihat hasilnya.

Tampilan sehabis di publish :

Isi dengan goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript.

Penjelasan:

• <p align="left"> dan </p> digunakan untuk memilih posisi text area nantinya, dalam hal ini aku pasang di sebelah kiri (“left”).
• <onclick="this.focus();this.select();" > Kode ini artinya ketika tombol Select All di klik, maka seluruh text yang ada didalamnya akan di select all (dipilih dan di block semua supaya sanggup di copy sekaligus)
• <textarea name="code" rows="4" cols="40" dan </textarea> yakni tag untuk menciptakan teks area.
• rows yakni untuk memilih tingginya.
• cols yakni untuk memilih lebarnya text area.

Contoh 2. Text Area Dengan Select Button:

Untuk menciptakan textarea  dengan memasang  tombol bantu Select All  ,  jikalau tombol Select All ditekan maka teks dalam area  eksklusif terpilih semua (HighLight) , maka gunakan arahan berikut ini :

<div><form name="copy"><div align="center">  <input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Select All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 200px; HEIGHT: 90px" name="txt" rows="100" wrap="VIRTUAL" cols="55"> isikan dengan  goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript, jikalau tombol Select All ditekan maka seluruh teks di area ini akan terpilih/highlight </textarea></p></div></form>

Ganti goresan pena " isikan dengan  goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript, jikalau tombol Select All ditekan maka seluruh teks di area ini akan terpilih/highlight " dengan text atau HTML/javascript yang Anda miliki.
Klik terbitkan atau publish, lihat hasilnya.

Tampilan sehabis di publish :

isikan dengan goresan pena Anda disini, sanggup berupa text biasa dan juga text berupa arahan HTML/Javascript, jikalau tombol Select All ditekan maka seluruh teks di area ini akan terpilih/highlight

 

Pada bab Contoh 2. Text Area Dengan Select Button terdapat dua bab element html, pertama yakni element arahan html pembuatan Select All button dan yang kedua yakni element arahan html untuk menciptakan text area.

Berikut yakni beberapa element penting yang mungkin perlu Anda ketahui:
Element within text area with Select All button:

1. <div align="center">. Kata center artinya posisi button akan berada di tengah. Jadi, jikalau Anda ingin posisi button/tombol berada disebelah kiri, ganti saja dengan kata
   left. Dan jikalau ingin berada disebelah kanan, ganti dengan kata
   right.
2. <input onclick="javascript:this.form.txt.focus ();this.form.txt.selec()">. , sebaiknya jangan merubah goresan pena ini.
3. Value="Select All". Kata Select All yakni kata yang akan muncul didalam button/tombol. Tulisan select all sanggup Anda ganti sesuai selera.
   

Element within manual text area :

1. <p align="center">. Menunjukan bahwa text area akan berada di tengah, jikalau Anda ingin text area berada disebelah kiri, ganti kata center dengan kata left untuk kiri atau right untuk dikanan.
2. <text style="WIDTH: 200px"> kata "WIDTH:200px", yakni lebar text area sebanyak 200 pixel. Jika Anda ingin merubah lebar text
   area, Anda sanggup menggantinya dengan angka yang anda inginkan, misalnya; 400px;
   

Semoga panduan ini bermanfaat bagi Anda.