menampilkan kode HTML di dalam postingan
secara otomatis. Untuk melakukannya, kita
harus menggunakan add ons/pengaya mozilla
firefox/menggunakan tesxarea. Sekarang
blogspot semakin canggih. Tanpa pengaya
mozilla & textarea, kita sudah bisa memposting
kode HTML secara otomatis. Lalu apakah
textarea masih diperlukan ? jawabannya bisa YA
bisa juga TIDAK. tergantung penilaian sobat
terhadap kelebihan dan kekurangan teks area.
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 teksarea di blog.
Untuk kekurangannya,saya rasa tidak ada.... HEHEHE
Beberapa Jenis & Cara Membuat Teks Area
Untuk membuat text area biasa, kode HTML yang digunakan 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 anda tampilkan didalam text area</textarea></div>
<textarea cols="30" name="code" rows="3">Ganti tulisan ini dengan dengan Teks atau Kode HTML yang ingin anda tampilkan didalam text area</textarea></div>
Hasilnya :
Besarnya Text Area tergantung dari besarnya angka ROWS (Tinggi kotak teks area)
dan COLS (Lebar kotak teks area).
dan COLS (Lebar kotak teks area).
- semakin besar angka ROWSnya, semakin tinggi ukuran kotak text area
begitu juga sebaliknya. - semakin besar angka COLSnya, semakin lebar ukuran kotak text area begitu
juga sebaliknya. - sobat bisa mengganti angka-angkanya sesuai kebutuhan sobat, pada contoh
di atas angka yang dimaksud adalah angka 3 dan 30. - ganti kode yang berwarna merah lainnya dengan tulisan yang akan dipasang
di dalam teks area. - kode yang berwarna biru (center) adalah kode untuk posisi teks area yaitu
tengah. Jika ingin membuat teks area dipinggir kiri, Ganti kode center dengan
kode Left , Untuk mengubah dipinggir kanan ganti kode dengan kode Right.
Berikut contoh posisi teks area :
ContohTeks Area di kiri Teks Area di tengah Teks Area di kanan
jika sobat ingin menampilkan banyak teks atau kode HTML didalam teks area,
sobat tidak perlu membuat kotak teks areanya terlalu besar, karena teks area otomatis
akan membuat Scroll kebawah atau kesamping, seperti contoh dibawah ini :
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 anda tampilkan di dalam text area</textarea></div>
</form>
</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 anda tampilkan di dalam text area</textarea></div>
</form>
</div>
Hasilnya :
Tidak ada komentar:
Posting Komentar