Cara membuat Teks Area

Sesuai dengan namanya,teks area merupakan salah satu tempat untuk melatakkan teks secara khusus, biasanya digunakan untuk meletakkan kode-kode script pada suatu artikel dengan tujuan agar mudah di copy oleh orang lain. Atau bisa juga dikatakann bahwa teks Area adalah tempat yang disiapkan untuk menaruh tulisan dalam sebuah area.


Pada postingan kali ini saya akan memberikan tiga contoh cara pembuatan teks area yang biasa digunakan.Caranya dengan menambah Gadget dan memilih HTML. Kodenya bisa anda copy dan edit sendiri sesuai kebutuhan anda di teks area berikut : 
  • Teks Area Biasa. Kodenya sebagai berikut :

<textarea name="code" rows="2" cols="30"><textarea name="code" rows="2" cols="30">Kode/teks anda disini</textarea></textarea>
Hasilnya seperti berikut



Teks Area Auto Selec, dengan mengarahkan kursor,teks yanga ada pada area akan terpilih semuanya. Kodenya adalah sebagai berikut :
<form name="Khocet Blog"> <p align="left" style="margin-top: 0; margin-bottom: 0"><textarea style="width: 200; height: 30" name="txt" rows="3" cols="45" onmouseover="this.form.txt.select()" readonly ;> Teks/kode yang mau anda  ditaruh disini</textarea></p>

Hasilnya sebagai berikut :


3. Teks Area auto selec dengan pilihan tombol. Cara membuatya yaitu:
  • Masuk ke Menu Design (Rancangan) lalu pulih Edit HTML tapi jangan lupa centang expan untuk menghindari kesalahan kemudian Cari kode </head>
  • Copy kode berikut sebelum kode </head>

<script type='text/javascript'>
function selectAll(){
document.formtombol.textarea.focus();
document.formtombol.textarea.select();
}</script>
<style type='text/css'>
div.textareatombol{
width:430px;
border:1px solid;
border-color:#f6fbd8;
background-color:#550202;
padding:10px;
}</style>
  • Simpan Template
  • Selanjutnya tambah Gadget dan pilih HTML/JavaScript
  • Copy dan paste kode dibawah ini pada gadget tersebut :
<center><div class="textareatombol">
<form name="formtombol" > <textarea cols="50" rows="3" name="textarea">Teks/kode anda tarud disini</textarea>
</form>
<input type="button" name="selectit" value="Select All" onclick="selectAll ();">

</div></center>
</form> <input type="button" name="selectit" value="Select All" onclick="selectAll ();">
</div></center>

Hasilnya seperti berikut :









Selamat mencoba.

0 comments: