Cara Pasang kotak bordiran di postingan Blog

Dalam mempublikasikan postingan di dalam suatu blog, tentunya kita menginginkan postingan dengan aneka variasi tampilan yang menarik. Agar tampilan postingan lebih bervariasi dan menarik, salah satunya dengan menambahkan kotak bordir atau bingkai pada kata-kata tertentu atau script tertentu.

Beberapa contoh bordiran / bingkai :

MASUKAN TEKS DISINI

Tulisan Anda...

MASUKAN TEKS DISINI

Apakah anda belum tahu tentang cara menambahkan Bordir /bigkai pada Postingan yang ingin anda terapkan. Berikut ini langkah-langkah yang harus diikuti :

1. Login ke blogger.com
2. Klik Entri baru
3. Tulis apa yang mau anda tulis, jika ingin memasang bordir di antara tulisan yang anda buat, maka copy kode dibawah ini (jangan lupa edit pada HTML)
   
   MEMBUAT BORDIR BLOG
   BERGARIS GARIS PUTUS-PUTUS
   <div style="border: 4px #345d15 dashed; padding: 10px; background-color: #eaeaea; text-align: left;"> MASUKAN TEKS DISINI </div>
   GARIS LURUS
   <div style="border: 4px #345d15 ridge; padding: 10px; background-color: #eaeaea; text-align: left;"> MASUKAN TEKS DISINI </div>
   TITIK TITIK
   <div style="border: 4px #345d15 dotted; padding: 10px; background-color: #eaeaea; text-align: left;"> MASUKAN TEKS DISINI </div>
   GARIS LURUS TEBAL
   <div style="border: 4px #345d15 solid; padding: 10px; background-color: #eaeaea; text-align: left"> MASUKAN TEKS DISINI </div>
   LAIN LAIN
   <div style="border: 4px #345d15 inset; padding: 10px; background-color: #eaeaea; text-align: left;"> MASUKAN TEKS DISINI </div>
   
   <div style="border: 4px #345d15 outset; padding: 10px; background-color: #eaeaea; text-align: left;"> MASUKAN TEKS DISINI </div>
   
   BORDIR SCROLL
   <div style="border: 4px #345d15 solid; padding: 10px; background-color: #eaeaea; overflow: auto; height: 60px; width: 260px; text-align: left;"> TULIS MASUKAN TEKS DISINI </div>
   
   
   
   BINGKAY
   
   <div style="border: 1px solid #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 1px dashed #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 1px dotted #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 4px double #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 4px groove #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 4px outset #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
   
   <div style="border: 4px ridge #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
   Tulisan Anda...
   </div>
4. Setelah di paste pada edit HTML, kemudian untuk melihatnya ganti pada edit Compose
5. Jika Postingan sudah selesai dibuat maka simpanlah hasil kerja anda.
6. Sebelum dipublikasikan ada baiknya Pratinjau terlebih dulu.

Selamat mencoba...Jangan lupa klik like ya...

Selengkapnya → Cara Pasang kotak bordiran di postingan Blog

Cara membuat kotak text area di blog

Text area merupakan suatu ruang yang digunakan untuk menempatkan text tertentu yang relatif panjang biasanya digunakan sebagai tempat penyimpanan kode-kode HTML/Javascript. Kotak text area juga bisa digunakan untuk menaruh pesan kepada pengunjung blog atau kepada diri sendiri.

Sebagai contoh

Di sini tempat untuk menyimpan kode HTML/Javascript atau pesan anda yang relatif panjang
Kebanyakan blogger meletakan Text area tersebut di sidebar blog dan di postingan blog. Oleh karenanya saya akan mencoba menjelaskan cara membuat text area di kedua tempat tersebut.

Membuat text area di sidebar blog

1. Login ke blogger, pilih Tata Letak
2. Klik Tambah Gadget, lalu pilih HTML/Java Script
3. Copy dan paste kode di bawah ini :
   
   <div align="center">
   <textarea cols="40" name="code" rows="10">Tulisan / Pesan Anda</textarea></div>
4. Sebelum disimpan anda bisa mengatur ukuran kotak, yaitu dengan merubah angka pada cols untuk lebar kotak dan rows untuk tinggi kotak.
5. Klik simpan dan lihat hasil akhirnya.

Membuat text are di postingan

Cara membuat text area di postingan blog sangat mudah sekali. Anda cukup memasukan kode yang telah disebutkan tadi atas ke dalam sebuah entri atau postingan dengan Edit HTML. Kemudian klik Pratinjau, jika sudah sesuai harapan, maka klik Publikasikan.

Semoga bermanfaat dan selamat mencoba...

Selengkapnya → Cara membuat kotak text area di blog