Cara Membuat Kotak Script Dalam Postingan Blog : 100% WORK - Jejakdzgn

Cara Membuat Kotak Script Dalam Postingan Blog : 100% WORK

Jejakdzgn.my.id - Pada kesempatan kali ini, saya akan share tutorial cara membuat kotak script dalam postingan blog.

cara-membuat-kotak-script-dalam-postingan-blog.

Kotak Script adalah sebuah kotak yang didalam nya terdapat bagian source kode, kotak script ini terbilang hampir mirip dengan syntaxt highlighter hanya saja tampilannya yang berbeda.

Fungsi dari kotak script agar tampilan pada kode source agar terlihat rapih dan tidak memakan tempat, bukan hanya itu aja tampilan kotak script ini pun banyak pilihan dan berbagai warna yang bisa anda gunakan untuk mempercantik tampilan blog anda.

Biasanya kotak script ini digunakan untuk blogger tutorial, agar tampilan source kode mereka terlihat rapih dan tidak menggangu para pengunjung.

Nah, jika anda tertarik untuk membuatnya, anda bisa mengikuti langkah-langkah dibawah ini.

cara membuat kotak script dalam postingan blog

Langkah 1 : masuk ke akun blogger.

Langkah 2 : buat postingan baru di blog anda.

Langkah 3 : ubah compose menjadi HTML.

Langkah 4 : silahkan copy kode dibawah ini, lalu pastekan kode tersebut kedalam HTML.

  <div style="background-color: #ffa66fborder: 2px #6e2222 dashed; text-align: left; height: 30px; overflow: auto; padding: 10px; width: auto;">Silahkan simpan  tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="background-color: #ffc7c7; border: 2px #6E2222 dotted; padding: 10px; text-align: left; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="background-color: #82cafa; border: 3px #6E2222 double; padding: 10px; text-align: left; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="background-color: #6eb76a; border: 2px #6E2222 inset; padding: 10px; text-align: left; height: 30pxoverflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="background-color: #c2c2c2; border: 2px #6E2222 ridge; padding: 10px; text-align: left; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="background-color: #d9da81; border: 2px #6E2222 solid; padding: 10px; text-align: left; height: 30pxoverflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid #2288dd; border-radius: 10px; padding: 10px; text-align: left; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<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; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<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; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<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; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

<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; height: 30px; overflow: auto; width: auto;">Silahkan simpan tulisan kalian yang akan menggunakan scroll box disini</div>

PENTING : Silahkan pilih kotak Script yang ingin anda gunakan, jangan lupa ganti warna merah dengan tulisan anda.

Langkah 5 : Publikasikan.

Akhir kata :

Itulah tutorial cara membuat kotak script dalam postingan blog, jika anda masih bingung, silahkan komentar dibawah ini.
Show Comments
Hide Comments

Belum ada Komentar untuk "Cara Membuat Kotak Script Dalam Postingan Blog : 100% WORK"

Posting Komentar

Catatan Untuk Para Jejaker
  • Mohon Tinggalkan jejak sesuai dengan judul artikel.
  • Tidak diperbolehkan untuk mempromosikan barang atau berjualan.
  • Dilarang mencantumkan link aktif di komentar.
  • Komentar dengan link aktif akan otomatis dihapus
  • *Berkomentarlah dengan baik, Kepribadian Anda tercemin saat berkomentar.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel