30 Detik Cara Membuat Kotak Script Di Posting Blog

1 Menit Cara Membuat Kotak Script Di Posting Blog- Kotak script ini biasanya digunakan untuk memposting kode-kode script blog, misalnya sobat mempunyai blog dengan niche tutorial, maka pasti sobat memerlukan kotak script ini. Bukan kewajiban sebenarnya, namun hanyalah sebagai bentuk kerapian dan keindahan blog.

Lalu bagaiamana cara membuat kotak script tersebut? apakah susah?

Jawabannya tentu sesuai judul postingan ini. Hanya 30 detik saja. Sobat tinggal copy kode nya lalu taruh di postingan blog sobat lalu jadi deh. Tidak sampai 30 detik sebenarnya hehe.

oke baiklah, langsung saja. Berikut adalah cara membuat kotak script di posting blog:

1. Log In ke Blogger
2. Pilih New Post atau Postingan Baru
3. Lalu silahkan sobat ketikkan seperti contoh dibawah ini:
   
   
   
   
4. Setelah sobat tulis seperti kata diatas, sekarang silahkan geser ke bagian HTML (samping Compose) Lalu Paste kan kode berikut ini tepat dibawah tulisan 1 detik cara membuat kotak script di blog.
   
   
   <div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
   text-align: left;">
   .Tulis Disini.</div>
   
   
5. Jika masih bingung, silahkan perhatikan contoh dibawah ini
   
   
   
   
6. Jika sudah, silahkan kembali ke Compose. Maka akan terlihat hasilnya seperti ini:
   
   
   
   
7. Selanjutnya, silahkan sobat klik dalam kotak tersebut lalu hapus tulisan klik disini dan silahkan sobat isi sendiri sesuai dengan apa yang mau sobat tulis

Selanjutnya kita akan membuat kotak script tersebut dengan scroll. Berikut caranya:

Cara Membuat Kotak Script Dengan Scroll

1. Cara awalnya sama seperti cara membuat kotak script biasa diatas. Bedanya adalah kode yang kita masukkan dibawah kalimat. Berikut kode untuk kotak script dengan scroll
   
   
   <div style="border: 3px #1780dd solid; padding: 10px;background-color:#ffffff;
   overflow: auto; height: 50px; width: 300px;
   text-align: left;">
   .kode script disini.</div>
   
   
2. Maka hasilnya akan seperti ini
   
   
   <div style="border: 3px #1780dd solid; padding: 10px;background-color:#ffffff;
   overflow: auto; height: 50px; width: 300px;
   text-align: left;">
   .kode script disini.</div>
   
   
   
   Keterangan Kode:

• border 3px adalah ketebalan kotak script
• #1780dd adalah kode untuk warna kotak script
• Double; adalah bentuk kotak script. Sobat bisa ganti dengan
  
  
  dashed
  dotted
  Double
  Groove
  inset
  outset
  ridge
  
  
• padding: 10px adalah panjang kotak script kebawah
• background-color:#ffffff adalah warna background kotak script #fffff = putih
• text-align: left;"> adalah posisi tulisan didalam kotak. left berarti tulisan di sebelah kiri
• overflow: auto adalah kode untuk fungsi scroll
• height adalah tinggi kotak
• width adalah lebar kotak

Demikian tutorial cara membuat kotak script di postingan blog. Semoga bermanfaat sobat. 

Tinggalkan komen jika ada yang perlu ditanyakan