Cara Membuat Kotak Script / Scroll Bar di Postingan Blog - Sering Dicari — Tutorial & Informasi Bermanfaat

Cara Membuat Kotak Script / Scroll Bar di Postingan Blog

Supaya pembaca betah membaca blog kita, mau tidak mau kita harus membuat blog kita menjadi rapi dan enak dibaca. Terlebih jika anda adalah seorang blogger yang suka membagikan tutorial atau berbagi script dan kode HTML.

Biasanya blogger pemula ingin membagikan kode namun hanya di-paste-kan saja ke dalam kolom menulis artikel, otomatis script tersebut akan berubah menjadi sesuai arahan kode atau tidak sepenuhnya menjadi script yang utuh. Maka dari itu, kita harus membuat kotak tersendiri untuk membedakan antara tulisan dengan script HTML.

Cara Membuat Kotak Script Scroll Bar di Artikel Blog - Sering Dicari

Fungsi kotak ini selain menambah estetika, juga mempermudah pengunjung blog untuk meng-copy kode yang ingin anda bagikan. Maka dari itu, dalam postingan ini saya ingin berbagi bagaimana caranya membuat kotak script HTML / Scroll Bar pada artikel blog, berikut caranya :

1. Masuk ke dalam blog anda dan buatlah artikel baru.
2. Ubah mode menulis Compose menjadi HTML. 

Anda tinggal pilih saja ingin membuat scroll bar secara horizontal atau vertical, silahkan pilih dan copy kode di bawah ini :

Scroll Bar Horizontal

<div style="background-color: #f9f8de; border:1px #dedede double;width:auto ;height:60px;overflow-y:hidden;overflow-x:scroll;"> <p style="width:2500%;">
  Masukkan script anda disini </p> </div>

Scroll Bar Vertical

<div style="background-color: #f9f8de; border: 1px #dedede double; height: 60px; overflow: auto; padding: 10px; text-align: left; width: auto;">
Masukkan script anda disini
 </div>

Keterangan
Warna ungu : Warna background kolom yang bisa anda rubah sesuai keinginan.
Warna biru : Ganti dengan script atau kata-kata yang anda inginkan.
height:60px : Tinggi kolom yang bisa anda atur sesuai dengan kebutuhan.

Saat anda paste kode di atas ke mode HTML, pindah terlebih dahulu ke mode Compose lagi, lalu masukkan script atau ganti tulisan Masukkan scipt anda disini. Setelah itu script akan 100% utuh. Jika ada pertanyaan silahkan berkomentar dibawah.

Terima kasih sudah membaca postingan "Cara membuat kotak script / scroll bar di postingan" kali ini, semoga bermanfaat. Jika anda suka, bagikan artikel ini ke sosial media anda. Salam!
Disqus comments