-->

Type something and hit enter

By On
Bagi kalian yang baru belajar membuat blog pasti bingung gimana cara membuat box scrip yang keren dan bagus awal nya saya juga ga ngerti gimana cara buat nya setelah saya cari tau dan baca di blog blog keren di luar sana akhirnya saya menumukan solusi atau jawaban yang tepat ternyata caranya cukup mudah dan gampang.

Cara membuat kotak script di blog

Keuntungan dari memasang script box agar artikel atau postingan kalian terlihat lebih rapi jadi yang baca juga nyaman dengan isi artikel kalian karna dengan memasang script box ada pembatas yaitu box antara code script dan kalimat jadi terlihat lebih rapi.

Jika kalian tertarik langsung aja simak caranya di bawah .


Langkah awal ;

  1. Pilih code script yang telah saya siapkan di bawah lalu copy.
  2. Masuk ke HTML postingan kalian dan paste kan code script yang telah saya siapkan di bawah.
  3. Lalu masuk ke Compose dan isi dengan code scrip yang kalian inginkan


Pilih box script di bawah ini sesuai keinginan kalian .

Style scroll box
<div style="overflow:auto;width:300px;height:100px;padding:10px;border:1px solid #eee">


Isi Scroll Box

</div>


Style scroll box
<div style="-moz-border-radius: 10px; -webkit-border-radius: 10px; background-color: #f3f3f3; border-left: 5px solid #2288dd; border-radius: 10px; height: 100px; overflow: auto; padding: 10px; padding: 10px; width: 600px;">


Isi Scroll Box

</div>


Style 1
<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;">
Pastekan Code Script Di Sini </div>

Style 2
<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;">
Pastekan Code Script Di Sini </div>

Style 3
<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;"> 
Pastekan Code Script Di Sini </div>

Style 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;">
Pastekan Code Script Di Sini </div>


Itulah code script cara membuat box script pada artikel tinggal kalian pilih saja mana yang bnar-benar cocok dan pas di blog kalian.

Dan kalian juga dapat mengedit box tersebut;

jika ingin mengganti warna background contoh
#000000 (hitam) tinggal kalian ganti saja menjadi #ffffff (putih).
Merubah ukuran sudut lengkung contoh
Border radius: 10px ganti dengan misal 5px.

Tinggal kalian edit aja susuka hati kalian
yang penting warnanya pas dengan template kalian agar terlihat lebih rapi postingan atau artikel kalian jadi pembaca lebih nyaman dan mengerti apa yang dimaksut dari isi artikel kalian.

Selamat mencoba...

2 Comments

avatar

Ane coba ya gan. Terima kasih tutorial nya

avatar

Mntap gan,,,
Ane ijin praktekin ya di blog :)

Silahkan berkomentar secara bijak dan sesuai topik pembahasan..

Click to comment