Cara Membuat Kotak Script Di Postingan
1. Bikin kotak teks html seperti diatas yaitu dengan cara masuk dashboard blog dan klik Entri Baru untuk membuat artikel baru yang akan ditambahkan kotak script
2. Kemudian isi judul dan klik mode HTML
3. Setelah itu masukkan kode berikut, masih dalam mode HTML :
==========================================================
<div style="background-color: white; border: 3px #eeeeee solid; padding: 10px; text-align: left;">
.Masukkan Kode Script Disini.</div>
==========================================================
.Masukkan Kode Script Disini.
#Ganti tulisan warna merah dengan script atau tulisan yang akan di masukkan dalam kotak
Jika sudah klik Mode Compose untuk melihat hasilnya
4. Berikut adalah tampilan kotak script biasa tanpa scroll yang telah sobat buat..
Jika sobat ingin menggunakan scroll pada kotak script tersebut tinggal menambahkan kode yang berwarna biru seperti dibawah ini
==================================================
<div style="background-color: white; border: 3px #eeeeee solid; padding: 10px; text-align: left; height: 100px; width: 520px; overflow: auto;">
.Masukkan Kode Script Disini.</div>
==================================================
.Masukkan Kode Script Disini.
#Untuk mengatur ukuran bisa ubah angka height (tinggi) dan widht (lebar) nya
Jika sudah bisa klik Publikasikan untuk mengepost artikel.. Selesai
5. Berikut adalah pilihan text box / kotak script yang berbagai macam bentuk dan warna yang bisa digunakan agar terlihat lebih keren :
=======================================
SCRIPT 1
=======================================
<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff; text-align: left;"> Kode Script Disini</div>
Kode Script Disini
================================================
SCRIPT 2
================================================
<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;">
Kode Script Disini</div>
Kode Script Disini
================================================
SCRIPT 3
================================================
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid #2288dd; border-radius: 10px; padding: 10px; t-align: left;">Kode Script Disini</div>
Kode Script Disini
================================================
SCRIPT 4
================================================
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #ffe599; border-radius: 10px; border: 2px dashed #aaa; padding: 10px; t-align: left;">Kode Script Disini</div>
Kode Script Disini
===================================
SCRIPT 5
===================================
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-radius: 10px; border: 4px solid #999; padding: 10px; t-align: left;">Kode Script Disini</div>
Kode Script Disini
===================================
SCRIPT 6
===================================
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #6fa8dc; border-radius: 10px; border: 4px double #fff; padding: 10px; t-align: left;">Kode Script Disini</div>
Kode Script Disini
====================================
SCRIPT 7
====================================
<div style="border: 2px #610B38 dashed; padding: 10px; background-color:#57AA52; tex>t-align: left;"> Kode Script Disini</div>
Kode Script Disini
====================================
SCRIPT 8
====================================
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #a2c4c9; border-radius: 10px; border: 4px outset #fff; padding: 10px; t-align: left;">Kode Script Disini</div>
Kode Script Disini
====================================
SCRIPT 9
====================================
<div style="border: 3px #5f200e double; padding: 10px; background-color: #82CAFA; text-align: left;"> Kode Script Disini</div>
Kode Script Disini
================================
SCRIPT 10
================================
<div style="border: 2px #006400 inset; padding: 10px; background-color: #d5839f; text-align: left;"> Kode Script Disini</div>
Kode Script Disini
================================
SCRIPT 11
================================
<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2; text-align: left;"> Kode Script Disini</div>
Kode Script Disini
================================
Sumber : http://carazain.blogspot.com/2016/09/cara-membuat-kotak-script-di-dalam-postingan-blog-terbaru.html
Posting Komentar