blog how to, blog trick, blog tips, tutorial blog, blog hack

HEADLINE NEWS

Selasa, 10 November 2009

Cara Membuat Text Area

Apa itu Text Area....? Untuk lebih memudahkan sobat, silahkan lihat di Bag. Sidebar blog ini dengan judul "Tukeran Link yu". Dimana.....di dalamnya ada kode-kode HTML untuk di copy paste. Memang setiap blog yang pasang text area, rata2 berfungsi untuk copy paste kode HTML bagi para pengunjungnya, Baik itu untuk tukeran link, atau pun untuk menyimpan kode2 HTML atau javascript yang nantinya akan di copy paste oleh pengunjung. Nah...bagaimana cara membuatnya, Silahkan copy paste kode di bawah ini :


<textarea rows="4" cols="20" name="code"> Simpan Text atau Kode HTML disini</textarea>


Contohnya Seperti ini :




Untuk mempermudah pemahaman sobat, berikut keterangan dari kode html diatas :
  • rows="4" --> Panjang area (Bisa diganti sesuai keinginan)
  • cols="20" --> lebar area (Bisa diganti sesuai keinginan)
Text Area dengan memakai HighLight

Ada variasi lain dari membuat text area ini, yakni text area dengan menggunakan tombol highlight. dengan adanya tombol highlight ini akan memudahkan bagi para pengunjung untuk mengcopy seluruh text ataupun kode-kode yang di berikan, karena dengan hanya sekali tekan saja pada tombol highlight tadi, maka seluruh text ataupun kode-kode yang ada di dalamnya akan di highlight dan tinggal di copy saja. Fasilitas ini sangat berguna tatkala text ataupun kode-kode yang di berikan dalan jumlah yang sangat banyak dan ini akan mengurangi resiko tertinggalnya suatu text ataupun kode-kode untuk di copy. Untuk membuat text area dengan menggunakan highlight ini silahkan anda copy kode HTML di bawah :

<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: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">simpan tulisan anda di sini, maka tulisan yang anda tulis akan muncul di sini dan siap di copy oleh para pengunjung</textarea></p></div></form>


Contohnya Seperti ini :




Agar anda lebih memahami kode di atas, sedikit akan saya uraikan. Kode di atas mempunyai dua elemen bagian, yakni elemen kode untuk membuat tombol yang bertuliskan Highlight All, dan yang kedua adalah elemen kode untuk membuat text area.

Elemen tombol highlight All :

  1. <div align="center">--> kata center menunjukan bahwa posisi tombol akan berada di tengah, jadi jika anda ingin posisi tombol berada di tepi sebelah kiri, tinggal ganti dengan kata left. Dan jika ingin berada di tepi sebelah kanan, tinggal ganti dengan kata right.


  2. <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()">--> kode ini artinya ketika tombol highlight di klik, maka seluruh text yang ada di dalamnya akan di highligt (di tandai atau di blok), jadi anda jangan merubah tulisan ini.


  3. Value="Highlight All" --> kata Highlight All adalah kata yang akan muncul di dalam tombol, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.
Selamat Mencoba......


 

© Black Newspaper Copyright by Widget | Template by Blogger Templates | Blog Trick at Blog-HowToTricks