Membuat Kotak Script Simple di Posting Blog

Banyak cara yang bisa dilakukan seorang blogger untuk optimasi pada blog, ambil salah satu contohnya dengan mempercantik tampilan posting blog. Halaman posting yang terlihat tertata, rapi, teratur, dan simple menjadi bagian yang perlu diperhatikan bloggers.

Meskipun isi sebuah artikel posting yang sangat menarik jika tidak memperhatikan tampilan publikasinya maka kemungkinan akan mengurangi minat baca pengunjung.

Sebaliknya walaupun artikel posting yang biasa - biasa saja jika dibuat dengan memperhatikan optimasi setidaknya pengunjung akan merasa fresh.

Agar postingan terlihatnya rapi dan teratur, salah satu contoh yang bisa dilakukan yaitu membuat kotak script/ box code yang digunakan sebagai text area untuk membedakan antara code script dengan teks artikel yang lain.

Berikut di bawah ini tentang cara mudah untuk menambahkan kotak script simple pada posting blog.

- Buka bagian tab HTML entri post
- Copy script box code yang tersedia di bawah sesuai versi kotak script
- Paste script box code diantara bagian yang diinginkan di tab HTML
- Buka kembali bagian tab Compose

ADA 5 VERSI KOTAK SCRIPT / BOX CODE

1. Box Code Border Left Solid
<div style="background-color: #f3f3f3; border-left: 5px solid #2288dd; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

2. Box Code Border Solid
<div style="background-color: #f3f3f3; border: 4px solid #999; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

3. Box Code Border Dashed
<div style="background-color: #ffe599; border: 2px dashed #aaa; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

4. Box Code Border Double
<div style="background-color: #6fa8dc; border: 4px double #fff; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

5. Box Code Border Outset
<div style="background-color: #a2c4c9; border: 4px outset #fff; padding: 10px; t-align: left;"> Tambahkan Script disini...</div>

Kreasikan dengan :
- Mengganti warna kotak  > backgroud-color: #kodewarna
- Merubah warna border > border: #kodewarna
- Mengatur ketebalan border > border: 4px

Sekian tips dari contekanbagus.blogspot.com semoga bermanfaat dan tinggalkan komentar untuk posting ini.

17 Comments

  1. hallo sob apa kabar nih ? kalo ada watu mampir ya sob

    ReplyDelete
  2. boleh nie info nya di coba, makasih gan

    ReplyDelete
  3. Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
    Jika ya, silahkan kunjungi website ini www.kumpulbagi.com untuk info selengkapnya.

    Di sana anda bisa dengan bebas share dan mendowload foto-foto keluarga dan trip, music, video, filem dll dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)

    ReplyDelete
  4. siiip...ok banget...terimakasih..

    ReplyDelete
  5. siiip...ok banget...terimakasih..

    ReplyDelete