Cara Manual dan Otomatis buat box/kotak kode script di dalam postingan

Translate

Cara buat box/kotak kode script di dalam postingan

Waones article’s dalam tips dan trik komputer kali ini akan berbagi sedikit informasi tentang Cara buat box/kotak kode script di dalam postingan.
Kenapa artikel ini saya posting, karena banyak Blogger Pemula seperti saya tadinya masih belum tahu tentang cara memasukan kode scrift sewaktu posting artikel ( lihat saja disini postingan saya terdahulu yang menggunakan Scrift terlihat tidak rapi).
Dan tentunya ini sangat bermanfa'at ketika sahabat membuat sebuah artikel yang di dalamnya banyak sekali menggunakan kode script yang harus ditampilkan.

Pada tutorial blogger kali ini yang membahas Cara buat box/kotak kode script di dalam postingan ini akan diberikan beberapa contoh box/kotak kode script yang saya buat, dan Sahabat Blogger Pemula dapat menggunakannya jika ada yang disukai dari contoh contoh Cara buat box/kotak kode script di dalam postingan yang akan saya berikan tips trik dibawah ini, dan tentunya sahabat Blogger Pemula juga bisa melakukan perubahan pada kode kodenya menurut selera sahabat masing masing. Seperti, ukuran dan jenis border, warna background, ukuran box atau yang lainnya.

Berikut ini adalah beberapa contoh Cara buat box/kotak kode script di dalam postingan;

inset border

....kode script sahabat....

Kodenya

<div style="border: 3px #006400 inset; padding: 10px; background-color:#d5839f;

text-align: left;">

....kode script sahabat....</div>

outset border

....kode script sahabat....

Kodenya

<div style="border: 3px #5f200e outset; padding: 10px; background-color:#d9da81;

text-align: left;">

....kode script sahabat....</div>

double border

....kode script sahabat....

Kodenya

<div style="border: 3px #5f200e double; padding: 10px; background-color:#82CAFA;

text-align: left;">

....kode script sahabat....</div>

dotted border

....kode script sahabat....

Kodenya

<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2;

text-align: left;">

....kode script sahabat....</div>

dashed border

....kode script sahabat....

Kodenya

<div style="border: 2px #610b38 dashed; padding: 10px; background-color:#57AA52;

text-align: left;">

....kode script sahabat....</div>

scroll box

...................kode script sahabat.............

Kodenya

<div style="border: 2px #006400 solid; padding: 10px; background-color:#82CAFA;

overflow: auto; height: 50px; width: 300px; text-align: left;">...................kode script sahabat.............</div>

Sahabat Pemula pilihlah salah satu kode yang disukai, kemudian copy kode scriptnya lalu sahabat paste kan kode tersebut dalam mode HTML di post editor Blogger saat posting artikel.
Sahabat Pemula bisa merubah ukuran border, warna border, ukuran box, warna background sesuai warna dan ukuran yang sahabat kehendaki.

Cara Membuat Kotak Script Otomatis di Posting

Sobat blogger pasti pernah melihat sebuah kotak script pada postingan, ini seringkali digunakan untuk membedakan antara script dan tulisan artikel pada postingan agar terlihat rapi. Kalau sobat blogger masih bingung silahkan lihat gambar dibawah ini :

Bagaimana cara membuat kotak script di posting, berikut langsung saja kita masuk ke langkah - langkah pembuatannya :

• Login akun blogger
• Anda Pilih Template > Edit HTML > klik Expand Template Widget
• Cari kode ]]></b:skin> 
• Copy kode dibawah ini dan Paste tepat diatas kode ]]></b:skin> 

/* http://waones-sbm.blogspot.com /
----------------------------------------------- */
.alert {margin: 10px 10px 10px 10px;
padding: 10px 15px 10px 15px;
line-height: 1.6em;color: #000000;
background: #e0ffff;
border: 1px solid #000000;
border-left: 15px solid #000000}

Keterangan : 
Silahkan ubah tulisan warna hijau sesuai template blog

• Kemudian Simpan Template

Selanjutnya sebelum kita menulis script pada posting, tambahkan kode berikut :

<p class="alert">
Tulis Script sahabat Disini
</p>

Selesai...

Sekian dahulu tutorial yang begitu singkat ini.Cara Manual dan Otomatis buat box/kotak kode script di dalam postingan 
Selamat mencoba untuk mengganti titel / judul blog dengan logo atau gambar, happy blogging.

Dan setelah  membuat Cara Manual dan Otomatis buat box/kotak kode script di dalam postingan  anda berhasil, mungkin anda tertarik untuk memasang iklan dengan menempelkan iklan banner pada blog anda, silahkan anda baca pada artikel Cara Membuat Iklan Banner Berganti Secara Otomatis atau CARA MEMASANG LOGO DI HEADER BLOGSPOT

Semoga postingan Cara Manual dan Otomatis buat box/kotak kode script di dalam postingan diatas dapat bermanfaat untuk anda, salam sukses selalu ...

Edit; wawansurya
Sumber ;
www.affiliate-waones.com
http://waones-sbm.blogspot.com
http://mitra-sbm.blogspot.com

merchant