Memuat...

Membuat Teks Area

Diposkan oleh: kuliksera | Sabtu, 23 Januari 2010
Teks area adalah tempat untuk menyimpan teks dengan membentuk area baru. Biasanya teks area ini di gunakan untuk menyimpan kode-kode HTML, JavaScript atau pun teks lainnya agar bisa di copy oleh para pengunjung.

Untuk membuat teks area silahkan ikuti langkah-langkah berikut ini :

1. Login ke Blog
2. Klik Tab Tata Letak
3. Klik Tambah Gadget
4. Klik pilihan menu HTML/JavaScript
5. Copy paste script di bawah ini

<p align="center"><textarea name="code" rows="3" cols="20">Tempat kode HTML,JavaScript atau teks</textarea></p>

hasilnya nanti akan seperti di bawah ini


Keterangan :
  • rows="3", menunjukan tinggi dari teks area. Jika anda menginginkan teks area yang lebih tinggi, maka silahkan ganti angka " 3 " dengan angka yang lebih tinggi nilainya
  • Cols="20", menunjukan lebar dari teks area. Jika anda menginginkan teks area yang lebih lebar, maka silahkan ganti angka " 20 " dengan angka yang lebih tinggi nilainya
  • ganti tulisan yang berwarna merah dengan HTML,JavaScript atau teks yang anda ingin masukkan
  • code di atas adalah code HTML,untuk meletakkannya di postingan blogspot,paste di ruang edit HTML. Karena jika paste di ruang Compose tidak akan terlihat seperti di atas

Teks area dengan memakai HighLight. Dengan adanya tombol highlight maka akan memudahkan bagi para pengunjung untuk mengcopy seluruh teks.
Silahkan anda copy paste script di bawah ini

<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><p align="center"><textarea style="WIDTH: 200px; HEIGHT: 100px" name="txt" rows="100" wrap="VIRTUAL" cols="55">Tempat kode HTML,JavaScript atau teks</textarea></p></div></form>

hasilnya nanti akan seperti di bawah ini


Keterangan :
  • HEIGHT: 100px" menunjukan tinggi dari teks area. Jika anda menginginkan teks area yang lebih tinggi, maka silahkan ganti angka 100px" dengan angka yang lebih tinggi nilainya
  • WIDTH: 200px; menunjukan lebar dari teks area. Jika anda menginginkan teks area yang lebih lebar, maka silahkan ganti angka 200px; dengan angka yang lebih tinggi nilainya
  • ganti tulisan yang berwarna merah dengan HTML, JavaScript atau teks yang anda ingin masukkan
  • ganti tulisan yang berwarna kuning dengan kalimat yang anda suka,misalnya Copy All atau Sorot All
  • code di atas adalah code HTML, untuk meletakkannya di postingan blogspot, paste di ruang edit HTML. Karena jika paste di ruang Compose tidak akan terlihat seperti di atas

Selain teks area seperti di atas, saya juga menambahkan beberapa contoh teks area yang menggunakan begron dan bentuk kolom bervariasi. Untuk codenya semua sudah ada di dalam kolom,tinggal anda copy saja. Untuk warna dan ukuran kolomnya anda bisa rubah sesuai keinginan. Dan yang perlu di ketahui, semua code yang ada di bawah adalah code HTML, untuk meletakkannya di postingan blog, pastekan di ruang edit HTML. Karena jika di paste di ruang Compose, tidak akan terlihat seperti di bawah :






























<div style="background-color: #555555; border: 2px solid rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px ridge rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px groove rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px inset rgb(0, 100, 0); padding: 10px; text-align: left;">
Isi Teks Area</div>

<div style="background-color: #555555; border: 2px outset rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px double rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px dotted rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px dashed rgb(0, 100, 0); padding: 10px; text-align: left;">Isi Teks Area</div>

<div style="background-color: #555555; border: 2px solid rgb(0, 100, 0); height: 50px; overflow: auto; padding: 10px; text-align: left; width: 300px;">Isi Teks Area</div>


6. Klik Pratinjau untuk melihat hasilnya
7. Klik Terbitkan Entri jika sudah sesuai dengan keinginan anda
8. Selesai


Bagi Anda yang memiliki pengetahuan, dan ingin berpartisipasi dalam menulis Artikel
untuk dipublikasikan di halaman www.kolom-pengetahuan.com, bisa mengirimkannya
melalui Email: kuliksera@ymail.com atau bisa juga melalui form kontak admin»

comment 0 komentar:

Poskan Komentar

 
© Kolom | Pengetahuan | Design by Blog template in collaboration with Concert Tickets, and Menopause symptoms
Powered by Blogger