🔔 Aktifkan notifikasi disini Google News

Cara Membuat Kotak Script di dalam Postingan

Kotak script adalah kotak khusus yang di sematkan di dalam postingan yang berfungsi untuk menempatkan kode HTML/JavaScript/CSS supaya terlihat lebih rapi, indah, dan mudah untuk di copy paste oleh pengunjung. Biasanya kotak ini sangat berhubungan erat dengan pemilik blogger yang materinya membahas tentang tutorial blog. Dengan adanya kotak ini, pengunjung akan lebih mudah dalam memilah antara kode dan tulisan biasa agar tidak terjadi kesalahan saat melakukan copy paste script.

Namun yang jadi masalah adalah kotak ini masih belum disediakan oleh pihak blogspot secara default. Sehingga kita harus membuatnya sendiri dengan kode yang akan saya berikan.

Langkah-langkah:
1. Login ke Blogger
2. Pilih New Post/Entri Baru

3. Tulis postingan dalam posisi Compose, sebelum memasukkan kotak script tekan tombol Enter 2x lalu ketik A.

4. Letakkan kursor ke bagian kosong (di atas A) dengan cara di klik 1x
5. Lalu tekan tombol HTML. Kursor tadi akan berada sebelum kode <br />

6. Copy script ini, paste kan kepostingan tadi
<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

7. Pindah ke posisi Compose lagi

8. Sekarang kalian bisa ganti tulisan saifullah.xyz (ganti tulisan ini). yang di dalam kotak dengan kata/kode yang diinginkan.
9. Huruf A bisa kalian hapus atau diganti dengan tulisan lain. Fungsi dari menambahkan Enter dan huruf A adalah supaya kalian bisa menulis di bawah kotak script. Tapi jika kalian meletakkan kotak script di akhir postingan tanpa diikuti tulisan yang lain, tidak perlu memasukkan Enter dan huruf A setelahnya. Huruf A hanyalah contoh, kalian bisa mengguanakan huruf yang lain. 

Kotak di atas bisa diubah sesuai keinginan. Berikut script yang bisa diubah:
<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

Keterangan:
  1. border: 3px = ketebalan kotak script.
  2. #1780dd = warna kotak script.
  3. Double = bentuk kotak script.

<div style="border: 3px #1780dd Dashed; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

<div style="border: 3px #1780dd Dotted; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

<div style="border: 3px #1780dd Groove; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

<div style="border: 3px #1780dd Inset; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/><br/>

<div style="border: 3px #1780dd Outsetpadding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

<div style="border: 3px #1780dd Ridge; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

<div style="border: 3px #1780dd Solid; padding: 10px;background-color:#ffffff;
text-align: left;">
saifullah.xyz (ganti tulisan ini).</div><br/>

4. padding:10px = panjang kotak ke bawah, untuk lebarnya otomatis sampai ke ujung posting.
5. background-color:#ffffff; = warna dalam kotak.
6. text-align: left; = posisi tulisan didalam kotak di kiri 

Untuk mendapatkan kode warna yang kamu inginkan, kamu bisa ke sini karena pada akhir artikel ada generator warna yang bisa kamu gunakan untuk mendapatkan kodenya.

Demikian cara membuat kotak script di dalam postingan, mudah bukan?
Selanjutnya tinggal dipraktekkan dan di edit sesuai selera kalian.

Semoga bermanfaat :)

Mau donasi lewat mana?

SeaBank - Saifullah (9016-9529-0071)

BRI - Saifullah (05680-10003-81533)

JAGO - Saifullah (1060-2675-3868)

BSI - Saifullah (0721-5491-550)
Merasa terbantu dengan artikel ini? Ayo dukung dengan memberikan rating Bintang 5. Tekan tombol merah disebelah kanan 👉
Selanjutnya kalian mau dibuatkan artikel tentang apalagi? Tuliskan pada kolom komentar di bawah ini

Posting Komentar

Berkomunikasi adalah salah satu cara untuk saling memahami, yuk tinggalkan komentar :)
Popular Emoji
😊😁😅🤣🤩🥰😘😜😔😥😪😭😱🤭😇🤲🙏👈👉👆👇👌👍❤🤦‍♂️❌✅⭐

Centang Beri Tahu Saya untuk mendapatkan notifikasi ketika komentar kamu sudah di jawab.
Parse:

Gambar Quote Pre Kode
Table of Contents



  • Home


  • Follow


  • Menu


  • Share


  • Comment
Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
English: We have detected that you are using adblocking plugin in your browser. The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.

Bahasa: Halo kak! Kakak pakai plugin pemblokir iklan ya? Tolong kecualikan website ini dalam pemblokiran ya. Karena kami butuh penghasilan dari iklan untuk terus mengelola website ini agar bisa terus update artikel bermanfaat. Makasih ya 😊
Site is Blocked
Sorry! This site is not available in your country.