Cara mudah membuat Script/Text box copy paste di dalam artikel Blogspot

Apabila kamu sering menyematkan Code Script atau kalimat khusus pada Artikel Blog kalian.Kalian harus coba Script box yang akan saya bagikan.Agar tampilan Blog kalian semakin menarik.caranya mudah kok.

Konten [Tampil]

Penjelasan

Pengunjung yang banyak pasti selalu di idam idamkan bagi para Blogger di seluruh dunia.Dengan pengunjung yang Ramai, kemungkinan penghasilan uang dari Artikel Blog kalian akan semakin mudah dan besar.Jika konten. kalian merujuk pada pembahasan codingan atau Tutorial Bloging tentunya kalian sering menyematkan dialog script pada artikel agar artikel kalian tidak rancu serta membuat tampilannya akan semakin menarik bagi para pembacanya.

 

Pentingnya Dialog box atau Script Box pada Artikel

Dialog Script sering kali kita temukan pada artikel Blog yang menjelaskan tentang Tutorial atau codingan.Tidak hanya untuk Script saja,Text box ini dapat kalian gunakan untuk tujuan lainnya seperti membuat kutipan text atau kalimat khusus yang ingin kalian sampaikan.Dan tujuan utamanya membuat dialog script di dalam artikel yaitu untuk memudahkan kalian mengcopy paster script yang akan kalian bagikan kepada pembaca.Dialog script dibuat sedemikian rupa agar menarik para pembaca.

Cara membuat dialog script atau script box pada blogspot

Langkah-langkah

• Pertama-tama silahkan kalian login ke akun blogspot masing-masing
• Pada beranda kalian klik "Create New"  atau "entri baru" seperti saat kalian ingin membuat artikel baru.

• Setelah itu kalian klik "HTML" (Bukan compose) jika kurang jelas bisa lihat gambar di bawah ini.
• Kemudian kalian Copy code di bawah ini lalu kalian paste kan code tersebut sesuai kebutuhan kalian,Perhatikan posisi penempatan harus dalam mode HTML ya, biasanya defaultnya itu Compose.

<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

• selanjutnya kalian baru bisa Mengaktifkan Compose dan lihat hasilnya.
• Kalian dapat mengubah Tulisan yang Berada di dalam kotak atau tulisan "~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian)"sesuai dengan keinginan kalian.

Model Script/Text box copy paste

 

Apabila kalian kurang menyukai dialog Box diatas kalian dapat mencoba beberapa Script box atau dialog blog yang menarik lainnya.Silahkan ikuti langkah langkah seperti di atas dan mengganti model script box dengan script di bawah ini.

<div style="background-color: white; border: 3px #1780dd dashed; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #1780dd dotted; padding: 10px; text-align: left;"> ~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian)</div>

Hasilnya :

~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian)

<div style="background-color: white; border: 3px #1780dd ridge; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #1780dd solid; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #1780dd groove; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #1780dd inset; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #1780dd outset; padding: 10px; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="background-color: white; border: 3px #eeeeee solid; padding: 10px; text-align: left; height: 100px; width: 520px; overflow: auto;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="border: 1px solid #444; padding: 10px; background-color: #eaeaea; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<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;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<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;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<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;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<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;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="border: 3px #5f200e double; padding: 10px; background-color: #82CAFA; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="border: 2px #006400 inset; padding: 10px; background-color: #d5839f; text-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<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;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

<div style="border: 2px #610B38 dashed; padding: 10px; background-color:#57AA52; tex> t-align: left;"> .~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).</div>

Hasilnya :

.~Oprekinaja (ganti tulisan ini sesuai kebutuhan kalian).

Nah jika kalian sudah mengikuti langkah-langkah di atas dengan benar maka jika kalian menambahkan script atau kalkmat khusus pada kotak text yang sudah kalian buat tampilan artikel kalian akan semakin menarik dan bagus.mudah bukan? 

Akhir kata

Mungkin itu saja yang dapat disampaikan dalam artikel ini,semoga artikel ini dapat bermanfaat untuk kalian semua .dan mohon maaf jika dalam artikel ini terdapat kesalahan dalam kata maupun penulisan .jika artikel ini bagus menurut kalian,kalian bisa share dan comment artikel ini di bawah postingan .Comment kalian sangat berguna dalam perkembangan blog ini.Sekian dan terimakasih.Salam Oprek :).

Share this post