Cara Mudah Membuat Kotak Script Dalam Postingan Blog

Dengan membuat atau menyematkan suatu tulisan blog akan terlihat lebih menarik bagi para pengunjung blog. Agar tulisan blog terlihat menarik dan indah, banyak Blogger menggunakan kotak dalam sebuah postingan untuk menaruh informasi penting, salah satunya adalah script HTML, Java dan sebagainya. 

Namun, kotak yang disematkan dalam postingan ini tidak disediakan default oleh Blogger, oleh karena itu kita harus membuatnya sendiri, berikut ini saya akan membahas dengan sederhana cara membuatnya,. Caranya cukup mudah silahkan ikuti langkah-langkahnya sebagai berikut:

• Login ke Blogger.com dan pilih 'Postingan Baru'
• Buat tulisan, contoh seperti gambar. Lihat yang berwana merah, posisi tulisan adalah 'Tampilan menulis'.

• Setelah itu copy paste script ini, dan kembali ke postingan Anda di Blogger. 

<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;

text-align: left;">

Mulkiaja (ganti tulisan ini).</div>

• Selanjutnya pilih 'Tampilan HTML' ( lihat gambar).

• Paste script yang tadi di copy di bawah postingan (terserah mau menaruhnya dimana).
• Kembali lagi aktifkan 'Tampilan Menulis' dan lihat hasilnya, dan hasilnya sekarang sudah ada kotaknya.

• Selanjutnya Anda bisa mengganti tulisan 'Mulkiaja (ganti tulisan ini).' dengan tulisan yang ingin Anda taruh disana, bisa berupa script atau tulisan lain.

Mungkin Anda tidak setuju dengan tampilan kotak contoh diatas. Anda bisa merubahnya sesuai selera Anda. Berikut ini penjelasan scriptnya.

<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;

text-align: left;">

Mulkiaja (ganti tulisan ini).</div>

• border: 3px = ketebalan kotak script. dan #1780dd = warna kotak script.
• Double : bentuk kotak. (kode ini bisa diganti dengan kode berikut atau juga bisa dihilangkan).

Mulkiaja (Dashed).

Mulkiaja (Groove).

Mulkiaja (Dotted).

Mulkiaja (Outset).

Mulkiaja (Inset).

Mulkiaja (Solid).

Mulkiaja (Ridge).

• padding:10px = panjang kotak ke bawah, untuk lebarnya otomatis sampai ke ujung postingan.
• background-color:ffffff; = warna dalam kotak.
• Dan text-align:left; = posisi tulisan didalam kotak di kiri 

Nah itulah penjelasan kode HTML untuk membentuk kotak script dalam postingan. Silahkan memodifikasi sesuai dengan selera Anda. Mudah diaplikasikan oleh Anda.

Untuk blog ini, script diatas saya modifikasi seperti kotak berikut.

<div style="background-color: #f3f3f3; padding: 10px; text-align: left;">

Mulkiaja (script kotak di blog ini)

</div>

Bagi Anda yang ingin bertanya atau memiliki kendala, silahkan tinggalkan komentar Anda. Semoga artikel sederhana yang say buat ini bisa memberi manfaat untuk sobat Blogger.

Share

Mulki

https://www.mulkiaja.com/

Blogger