cara buat Textarea di postingan

Textarea berfungsi untuk membatasi teks postingan yang terlalu panjang menjulur kebawah , pastinya postingan akan lebih ringkas. Textarea juga bukan sebuah box sederhana saja yang sekedar tampil apa adanya untuk wadah link exchange, banner exchange atau kode html dan teks yang lain. Dengan sedikit polesan bedak berupa kode CSS dan CSS3, tak seorangpun akan menduga bahwa yang mereka lihat adalah sebuah textarea. Anda dapat menggunakan textarea penuh gaya ini di blog untuk wadah baru yang tampil penuh pesona.

 

Cara Membuat Textarea

• Login to blogger.
• KLIK link "Design (Rancangan)".
• KLIK link "Edit HTML".
• Cari kode ]]> .
• Copy dan patekan kode CSS textarea di atas kode ]]>.
• KLIK "SAVE Templates (Simpan Template)".
• Lanjutkan dengan cara menggunakan xHTML textarea.

 Kodenya dibawah ini, silahkan copy paste..!!

textarea.GRetarea {
       font-size: 14px;
       font-family: Arial, Tahoma, Helvetica;
       border: 0px solid transparent;
       outline: none;
       border: 5px solid; 
       border-color: #ccc #aaa #aaa #ccc;
       border-radius: 12px; 
      -moz-border-radius: 12px; 
      -webkit-border-radius: 12px;      
       background: #eee; 
       box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;  
      -moz-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555; 
      -webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 10px #555;
       text-shadow: 1px 1px 1px #666; 
       padding: 5px 5px 2px; 
       color: #625F3C; 
       margin: 15px 5px;
      -o-transition: all 1s ease-out;
      -moz-transition: all 1s ease-out;
      -webkit-transition: all 1s ease-out;    
}
textarea.GRetarea:hover {
       border-color: #aaa #888 #888 #aaa;
       border-radius: 8px; 
      -moz-border-radius: 8px; 
      -webkit-border-radius: 8px;      
       background: #fff; 
       color: #111;
       text-shadow: 1px 1px 1px #aaa;
       box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;  
      -moz-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222; 
      -webkit-box-shadow: -1px -1px 1px #533801, 1px 1px 1px #533801, 1px 1px 20px #222;
}

Gunakan KODE berikut saat melakukan posting :

<textarea class="GReterea" row="20" cols="60">Tuliskan Teks atau Kode HTML di sini !</ttextarea>

 Catatan :

• Textarea berfungsi sebagai wadah teks dimana semua bentuk teks akan di tampilkan apa adanya, termasuk kode HTML.

• row="6" adalah ukuran tinggi textarea. Rubah nilainya untuk merubah ketinggian textarea ;Semakin kecil akan semakin pendek, sedang apabila diperbesar akan semakin tinggi.
• cols="60" adalah ukuran lebar. Semakin besar semakin lebar dan sebaliknya bila diperkecil maka akan semakin berkurang lebarnya.
• Ukuran text dapat dirubah dengan merubah nilai pada : font-size: 14px;

Selamat Mencoba..!

by :gubhug reyot.blogspot.com