REKANAN

Followers

umpan balik

Waktu Sholat Hari ini

Cara membuat text area di halaman web atau blog

Text area, kata ini sebenarnya baru bagi kami. Ketika penulis menjumpai kolom unik di halaman web atau blog yang di dalamnya terdapat kode-kode HTML untuk dicopy pengunjung, pertanyaan besar menyelimuti pikiran penulis tentang kolom unik itu. Bagaimana cara membuat nya di halaman web atau blog, apa namanya dan lain-lain. Karena waktu itu belum tahu nama atau istilahnya, belakangan diketahui namanya text area, maka penulis bertanya ke berbagai search engines terutama google dengan menggunakan berbagai macam text atau kata kunci yang mungkin mengarah ke istilah itu, yaitu text area . Sukur akhirnya ketemu juga nama atau istilah untuk hal itu, yaitu text area. Karena pengalaman inilah penulis menyadari tentang betapa pentingnya sebuah nama. Tanpa tahu nama atau istilah maka kita akan dibuat bingung karenya. Kok malah curhat .... gara-gara istilah text area.

Sampai saat ini penulis menemukan 3 bentuk text area. Maka tiga bentuk text area itu yang akan kita bicarakan di sini, terutama bagaimana cara membuatnya di web atau blog kita. Adapun kegunaan yang paling sering dijumpai atas pemasangan text area tersebut adalah untuk menyimpan kode-kode HTML tertentu yang ditawarkan pemilik blog atau web kepada pengunjung agar mereka mudah mengcopy kode kode tersebut agar kemudian dipasang di web atau blog milik pengunjung. Misalnya kode HTML untuk tukar link, kode HTML script text iklan, dan lain lain.

Siapa yang merancang pertama kali bentuk-bentuk text area itu, penulis sendiri tidak bisa mengetahui karena begitu banyaknya web, blog atau situs di internet yang membahas tentang text area ini.

Agar tidak melebar kemana-mana pembicaraan ini, mari kita mulai saja membahas cara membuat text area yang sejak tadi kata omongkan di depan.

cara membuat serta hasil tampilan dari tiga bentuk text area tersebut dapat anda lihat di bawah ini. Namun ada yang harus anda ketahui bahwa hal pokok dalam membuat text area adalah diawali dengan kode <textarea dan diakhiri dengan tanda atau kode </textarea>. Berikut ini jenis-jenis text area dimaksud:

1. Text area jenis pertama.

Text area yang pertama ini bentuknya biasa. Kode yang digunakan untuk membuat text area jenis ini seperti adalah:

<p align="center"><textarea rows="5" cols="50">
&lt;a href=&quot;http://kerjausahainternet.blogspot.com/&quot; title=&quot;Belajar blogging atau ngeblog di blogspot&quot; target=&quot;_blank&quot;&gt; &lt;img src=&quot;http://lh4.ggpht.com/_T227XRrZeIU/S_efGStPj9I/AAAAAAAAAMM/hnSyC0urR5k/s144/tukar%20link.jpg&quot; /&gt;&lt;/a&gt;
</textarea> </p>

Yang berwarna merah adalah yang ingin diisikan dalam text area. Anda bisa mengisinya sesuai tujuan anda. Isi bisa berupa text atau kode-kode HTML. Jika yang akan diisikan berupa kode HTML maka cara menulis kode HTML tersebut harus seperti diatas, yaitu kode HTML diparse terlebih dulu. Tentang parse kode HTML kita pernah membicarakan di sini.
Selain itu anda bisa mengatur ukuran baris dan lebar dari text area yang ingin anda tampilkan dengan mengubah angka pada rows (baris) dan cols (colom). Tampilan yang dihasilkan dari kode text area di atas dapat dilihat di halaman web atau blog anda seperti di bawah ini:



2. text area jenis kedua, atau text area dengan highlight, artinya jika tombol highlight yang menyertai kode text area itu diklik, semua kode dalam text area tersebut bisa tersorot semua, sehingga tidak akan mungkin tertinggal sedikitpun apabila akan dicopy. Tombol yang diberi nama highlight dapat dirubah dengan nama lain, misalnya Pilih semua. Adapun kode yang digunakan untuk text area jenis ini adalah sebagai berikut:

<form><p align="center"><input onclick="javascript:this.form.albritext.focus();this.form.albritext.select();" value="Pilih semua" type="button"><br>
<textarea name="albritext" rows="8" cols="50">
&lt;a href=&quot;http://kerjausahainternet.blogspot.com/&quot; title=&quot;Belajar blogging atau ngeblog di blogspot&quot; target=&quot;_blank&quot;&gt; &lt;img src=&quot;http://lh4.ggpht.com/_T227XRrZeIU/S_efGStPj9I/AAAAAAAAAMM/hnSyC0urR5k/s144/tukar%20link.jpg&quot; /&gt;&lt;/a&gt;
</textarea> </p></form>

Tentang yang berwarna merah, penjelasannya seperti nomor 1 di atas. Dan adapun tampilan dari kode text area di atas dapat anda saksikan di halaman web atau blog anda seperti di bawah ini:




3. Text area jenis ketiga. Jenis yang ketiga ini hampir sama seperti text area jenis kedua. Bedanya untuk text area jenis ini tidak disertai tombol highlight seperti text area jenis kedua. Sedangkan persamaannya adalah dalam mengambil text atau kode HTML yang ada di dalam text area jenis ini cukup dengan satu kali klik seperti text area jenis kedua. Cuma saja klik untuk text area jenis ini dilakukan di dalam text atau kode HTML yang ada di dalamnya. Tidak seperti text area jenis kedua, di mana klik dilakukan pada tombol highlight yang disertakan dalam text area itu. Kode yang dipakai untuk membuat text area jenis ini sebagai berikut:

<p align="center"><textarea rows="5" cols="50" onclick="this.focus(); this.select();">
&lt;a href=&quot;http://kerjausahainternet.blogspot.com/&quot; title=&quot;Belajar blogging atau ngeblog di blogspot&quot; target=&quot;_blank&quot;&gt; &lt;img src=&quot;http://lh4.ggpht.com/_T227XRrZeIU/S_efGStPj9I/AAAAAAAAAMM/hnSyC0urR5k/s144/tukar%20link.jpg&quot; /&gt;&lt;/a&gt;
</textarea></p>

Dari kode text area di atas akan tampil di halaman blog anda seperti di bawah ini:



Seperti itu yang penulis lakukan untuk membuat text area di halaman posting ini di mana kode text area yang kami tunjukkan kami sertakan contoh tampilannya. Kepada pembaca semuanya, jika ada yang tercecer dari uraian di atas kami senantiasa menantikan komentar, saran dan kritik dari anda semuanya untuk disampaikan di kolom komentar. Demikian, semoga bermanfaat.

Baca Artikel Terkait berikut ini:



2 comments:

nangalimangdotcom said...

bro tulisannya susah di baca ne.....

Uem Cuters said...

Saya coba terapkan gan, trim ya. Ditunggu kunjungannya...

Post a Comment