Home » » Cara Membuat Text Are pada Blog

Cara Membuat Text Are pada Blog

Written By Unknown | Posted on 26/02/13 | 11:37 AM

Dengan Text Area, kita bisa memberikan batas pada tulisan atau kode HTML atau apa saja di dalam artikel untuk memperjelas tulisan di dalam text area.
Dengan text area, tulisan akan terlihat lebih rapi dengan adanya kotak sebagai pembatas tulisan yang ingin ditonjolkan di dalam postingan blog.
Selain itu, blogger juga membutuhkan teks area untuk menampilkan kode HTML pada sidebar blog, meskipun bisa juga menggunakan "kotak dengan fungsi scroll". Kelebihan lain teks area akan terlihat setelah mengetahui beberapa cara membuat teks area di blog. Untuk kekurangannya,saya rasa tidak ada

Beberapa Jenis dan Cara Membuat Teks Area
Untuk membuat text area biasa, kode HTML yang di gunakan seperti ini :


<textarea>Tulisan di dalam teks area</textarea>


Karena terlalu sederhana, saya akan menulis beberapa macam cara membuat teks area di blog agar teks area menjadi lebih menarik.

Kode untuk membuat teks area pertama :

<div align="center">
<textarea cols="30" name="code" rows="3">
Ganti tulisan ini dengan dengan Teks atau Kode HTML yang ingin sobat tampilkan didalam text area</textarea></div>


Hasilnya :



Dengan sedikit menambahkan kode html, text area akan menjadi lebih menarik, yaitu dengan menambahkan tombol untuk di klik. Saat tombol text area di klik semua tulisan yang ada di dalam text area akan langsung terpilih dan tinggal di Copy dengan klik kanan kode yang sudah terpilih lalu pilih salin / copy atau langsung menekan tombol CTRL + huruf C di keyboard. Dengan teks area seperti ini, maka tidak akan ada kode yang tertinggal untuk di copy. Text Area jenis ini di kenal dengan nama Text Area dengan Tombol Highlight. Kode yang digunakan untuk membuat teks area otomatis ini adalah :

<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">
<textarea cols="30" name="txt" rows="5" wrap="VIRTUAL">
Ganti tulisan ini dengan tulisan atau Kode HTML yang akan sobat tampilkan di dalam text area</textarea></div>
</form>
</div>


 Hasilnya :

Share Artikel ini :

 
Copyleft © 2013. WUS24™ - All Rights Reserved.
Template Designed by Doanx. Supported by WUS24™