Membuat Text Area Pada Blog

[Z-Xp] Kode HTML memang belum tentu bisa di tampilkan di postingan blog/website anda, dan kita dapat menampilkannya dengan menggunakan Text Area.
Selain berguna untuk menampilkan kode HTML di postingan, anda juga dapat menggunakan text area sebagai tempat untuk menampilkan kode HTML untuk memudahkan pengunjung copy kode HTML tersebut.
Lalu bagaimana caranya?

Untuk membuat Text Area masukkan kode script Text Area pada postingan dan anda juga dapat menepatkan pada widget bar untuk menampilkan kode untuk Link Exchange yang biasanya dipakai untuk Tukar Link antar blogger satu dengan lainnya.

Berikut ini kode untuk Text Area :

<p align="center"><textarea name="code" rows="6" cols="20"> Simpan Text atau kode HTML disini </textarea></p>

maka hasil yang akan anda dapat yaitu :

Simpan Text atau kode HTML disini

Ada juga Text Area dengan tampilan berbeda dan mempermudah anda atau pengunjung blog anda mengcopy sebuah kode HTML, yaitu dengan tombol "Highlight All" pada Text Area tersebut.
Hmm, mungkin anda sudah tahu apa fungsi Highlight All itu..
Highlight All berfungsi mem-blok semua kalimat/huruf jadi anda tidak perlu susah payah untuk mem-blok kalimat/huruf.
langsung saja ..

Kode Text Area dengan tombol "Highlight All" :

<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>

Kode Highlight 

<p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55"> Ganti tulisan ini menjadi kode HTML yang ingin anda tampilkan </textarea></p></div></form>

Kode Text Area

Maka hasilnya akan seperti ini :

Ganti tulisan ini menjadi kode HTML yang ingin anda tampilkan

Ada satu lagi yang harus anda perhatikan, yaitu jika anda ingin text area tersebut berada di tengah, maka berikan kode <center>  pada awal kode, dan </center> di akhir kode tersebut.

Catatan : tulisan yang berwarna merah dapat anda ganti dengan ukuran lain sesuai selera anda, dan untuk tulisan berwarna biru dapat anda ganti sesuai selera anda. Kode diatas bertampilan tombol "Highlight All" berada di atas kotak Text Area.

Apabila ada yang masih bingung silahkan ditanyakan.

Selamat Mencoba