January 31, 2011

Membuat Text Area di Blog

Membuat Text Area di Blog - Text area adalah suatu tempat atau area yang digunakan untuk menyimpan suatu teks atau kode HTML tertentu. dalam penggunaannya text area bisa ditempatkan di dalam suatu page(halaman) atau bisa juga diletakkan dalam suatu widget. Dengan menggunakan text area, pengunjung blog akan lebih dimudahkan dalam proses mennyalin data (copy).

Buat memudahkan kita semua dalam memahami "text area", berikut ini adalah kode dasar/standar dari text area . . .

<textarea>isi dari teks area</textarea>

hasilnya akan seperti ini:

Contoh diatas adalah text area yang dibuat dengan kode/script standar. Sebenernya ada beberapa jenis text area yang bisa dibuat, tapi gw coba buat sharing 4 jenis "text area" yang biasa digunain dalam proses blogging.

1. Text Area yang kolom dan barisnya bisa diatur
Kode:
<div align="center">
<textarea name="code" rows="2" cols=35">Masukkan teks/kode disini !! teks/kode tersebut adalah teks/kode yang akan tampil sebagai isi dari "text area" yang dibuat</textarea></div>

hasilnya:

2. Text Area dengan satu klik maka seluruh isi akan di blok
Kode:
<div align="center">
<textarea rows="2" cols="35" onclick="this.focus(); this.select();">Coba klik teks ini !!</textarea></div>

Hasilnya:

3. Text Area dengan tambahan select all button
Kode:
<div align="center">
<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">
<textarea style="width: 300px; height: 80px" name="txt" rows="100" wrap="VIRTUAL" cols="55">Masukkan teks/kode disini !! teks/kode tersebut adalah teks/kode yang akan tampil sebagai isi dari "text area" yang dibuat</textarea>
</div>
</div>
</form>

Hasilnya:

4. Text Area yang jika disorot mouse akan di blok semua
Kode:
<div>
<form name="agungindraguna">
<div align="center" style="margin-bottom: 0pt; margin-top: 0pt;">
<textarea ;="" cols="55" name="txt" onmouseover="this.form.txt.select()" readonly="readonly" rows="100" style="height: 50px; width: 300px;">coba arahkan mouse ke teks ini !!</textarea></div>
</form>
</div>

Hasilnya:

Keempat jenis text area di atas adalah yang umum dipergunakan dalam proses blogging. Sebenernya masih ada jenis lainnya, yaitu Text Area dengan border

Kode:
<div align="center"><textarea cols="35" rows="2" style="border: 2px dotted red ;">Tulis apa aja deh.. terserah !!</textarea></div>

Hasilnya:

Text area border ini jarang gw temuin di blognya temen-temen blogger lain. Mungkin karena tampilannya rada beda, jadi engga banyak yang mau ngegunainnya.

Gw kira sharing kali ini cukup . . . Semoga bermanfaat buat kita semua !! Amiiinnn !!








Related Post on Agung X-Zeg Indraguna's World_

12 komentar:

SyahidaComputer said...

nice tips shob ...

BRI Jakarta Veteran said...

keren sahabat ...

Agung X-Zeg Indraguna said...

@Syahida : thx..
@BRI Jakarta Veteran : terima kasih udah nyempetin baca kawan !!

Muh. Hanif said...

Lengkap banget sob,,,

ECAZA said...

wah daridulu ini nih yang saya cari..
nice info neng..
hehe..

Agung X-Zeg Indraguna said...

@Sahili : haha.. ia sob, masih belajar nih !!
@ECAZA : Wew... nama gw Agung sob.. kenapa pake panggil nenk??? wkwk

Hidup Penuh Warna said...

artikel yg sangat bagus sob...

Reyazandi said...

boleh dicoba ga ??
jangan lupa mampir ya..

nursanti yuana said...

nice

ARMAN BLOG said...

Cara ngerubah warna sebagian tulisan script yg ada dalam textarea gmna ya sob??

ARMAN BLOG said...

klo ada mohon dsamperin caranya ke blog saya sob..:)

Website said...

nice info, thq kk

Post a Comment