Terkadang di dalam postingan kita ingin buat kotak teks (text area), di dalam kotak teks bisa diisi dengan teks, link, banner, dll. Ada banyak cara / script yang bisa temen-temen gunakan untuk membuat kotak teks (text box) tersebut. Kotak teks ini biasanya digunakan untuk membuat form untuk tukaran link dengan blog lain.Sebagai contoh di bawah ini adalah beberapa macam cara membuat kotak teks (text box) dengan script yang berbeda.
Contoh 1:
* Teks rata tengah = text-align: center; center bisa diganti dengan left, right,justify
* Background warna biru = background-color: rgb(0, 0, 240) angaka 0 dan 240 bisa anda ubah sesuai keinginan (untuk mengubah warnanya)
Script: (dimasukkan di dalam postingan)
<div style="background-color: green; border: 2px solid rgb(245, 184, 0); color: blue; display: block; padding: 10px; text-align: center;">
<a href="http://rizalblogmaster.blogspot.com">Belajar Blog || Domain Gratis </a> </div>
Catatan: <a href="http://rizalblogmaster.blogspot.com">Belajar Blog || Domain Gratis </a> diganti dengan teks yang ingin anda tulis. ( jangan lupa di tutup dengan akhiran </div> ketika selesai menuliskan teks)
Hasilnya:
<a href="http://rizalblogmaster.blogspot.com">Belajar Blog || Domain Gratis </a>
Contoh 2:
* Teks otomatis rata kiri
* Background warna hitam = background-color: black; black bisa diganti dengan warna lain seperti white, red, blue, green, dsb, warna lainnya bisa dilihat disini daftar warna
* Link diisi hingga baris pertama penuh kemudian akan berpindah ke baris 2
*Tinggi kotak teks 100 px (pixel) = height: 100px; angka 100 bisa diubah sesuai kebutuhan
Script: (dimasukkan di dalam postingan)
<div style="border: 2px solid rgb(202, 61, 217); padding: 1px; overflow: auto; height: 100px; background-color: black; "><br>
<a href="http://rizalblogmaster.blogspot.com">Belajar Blog || Domain Gratis </a> <a href="http://andra9.co.cc/">Download Anime Free</a><br>
</div>
Contoh 3:
* Teks otomatis rata kiri
* Background transparan
* Link diisi per baris 1 link
*Tinggi kotak teks 200 px (pixel) = height: 100px; angka 100 bisa diubah sesuai kebutuhan
Script: (dimasukkan di dalam postingan)
<div style="border: 2px solid rgb(202, 61, 217); padding: 1px; overflow: auto; height: 200px; "> <br>
<a href="http://rizalblogmaster.blogspot.com">Belajar Blog || Domain Gratis </a> <br><a href="http://andra9.co.cc/">Download Anime Free</a>
<br>
</div>
kode di atas dimasukkan saat membuat entri baru / edit entri dalam mode "Edit HTML"
Mudah-mudahan postingan ini dapat bermanfaat bag teman-teman semua. Jika masih ada yang kurang jelas silahkan di tanyakan di kotak komentar. Selamat Mencoba.. dan terima kasih.:)
Terima kasih atas panduan tersebut... Saya sudah Apply.. Nice!!
ReplyDelete@yaya: ok. terima kash kembali.
ReplyDeleteselmat blogging.:)