Cara Membuat Tulisan Dalam Kotak di Blog – Membuat sebuah artikel pada blog adalah hal yang wajib dilakukan oleh blogger. Nah, bagi blogger pemula terkadang masih kebingung dalam hal membuat tulisan dalam kotak di blog untuk meng-highlight atau sekedar keinginan diri sendiri.
Bagi blogger membuat sebuah postingan artikel yang baik, menarik dan enak dibaca tentu saja menjadi hal yang memang diinginkan pada setiap artikel yang dibuatnya.
Dan itu tidak lepas dengan saya, hingga saat ini saya tetap ingin menyuguhkan artikel dengan tampilan yang enak dan nyaman untuk dibaca.
Namun adakalanya kebingungan itu terjadi ketika ingin membaut sebuah tulisan dalam kotak di blog yang akan memapaparkan suatu kalimat yang penting dan seo friendly.
Pada kesempatan kali ini, saya ingin membahas hal tersebut yang terkadang menjadi kebingung tersendiri bagi seorang blogger terutama blogger pemula. Untuk pembuatan tulisan dalam kotak di blog itu sendiri menggunakan html sederhana.
Tidak mengerti html? Kamu tidak perlu memahaminya. Dengan artikel ini, kamu cukup melakukan copy-paste kode html di bawah ini.
Langkah-Langkah Membuat Tulisan Dalam Kotak di Blog
Berikut panduan lengkap membuat tulisan dalam kotak di blog yang dapat kamu
ikuti dan praktekkan dengan mudah:
- Masuk ke Blogger
- Buatlah entri baru atau postingan baru
- Mulailah dengan menentukan judul artikel yang akan kamu buat
- Pada saat sampai pada kalimat yang ingin kamu jadikan kotak, masuk ke Mode Html dan paste-kan kode script yang ingin kamu gunakan pada artikel kamu.
- Untuk melanjutkan penulisan, kamu dapat kembali ke mode Tampilan Menulis untuk melihat hasil kotak yang sudah kamu masukkan tadi.
Setelah selesai membuat tulisan dalam kotak, cobalah untuk melakukan Pratinjau dahulu sebelum kamu publikasikan artikelnya. Saya kira semua sudah mengerti bagaimana cara memasang script pada tampilan html. Jika masih ada kebijngungan silahkan tinggalkan pertanyaan di kolom komentar.
Jenis Border untuk Tulisan Dalam Kotak di Blog
Ada berbagai macam jenis kotak yang unik dan menarik yang dapat kamu terapkan pada postingan artikel yang kamu buat.
Pilihan border ini dapat kamu sesuaikan dengan kebutuhan untuk postingan kamu. Untuk kode scriptnya sudah berada di dalam kotak yang sesuai dengan jenisnya.
Kotak Border Double Warna Hijau
<div style=”border: 3px #04B45F Double; padding:
10px;background-color:#FFFFFF; text-align: left;”>TULISAN
DISINI</div>
Kotak Background Biru
<p style=”border: 1px solid rgb(204, 204, 204); padding: 15px; display:
block; background-color: #cfe2f3; text-align: center;”>TULISAN
DISINI</p>
Kotak Background Biru Tua
<p style=”border: solid 1px #eceff5; background: #29447E; padding: 15px;
margin: 0; text-align: justify; line-height: 23px; color: white; font-size:
18px”>TULISAN DISINI</p>
Kotak Background Samar
<div style=”border: 1px solid #CCC; margin: 10px 0px; padding: 10px;
width: auto; height: auto; background-color: #FBFBEE; text-align:
left;”>tulisan disini</div>
Kotak Background Abu-Abu Siku Melengkung
<p style=”border: solid 1px #aaa; background: #ccc; padding: 15px;
-moz-border-radius: 15px; -khtml-border-radius: 15px; -webkit-border-radius:
15px; border-radius: 15px; margin: 0; text-align: justify; line-height:
23px; color: black; font-size: 18px”>TULISAN DISINI</p>
Kotak Border Merah Putus-Putus
<p style=”border: dashed 2px #ee3f10; padding: 15px; margin: 0;
text-align: justify; line-height: 23px; color: #1a356e; font-size:
18px”>TULISAN DISINI</p>
Kotak Border Abu-Abu Putus
<p style=”border: dashed 2px #eceff5; padding: 15px; margin: 0;
text-align: justify; line-height: 23px; color: #1a356e; font-size:
18px”>TULISAN DISINI</p>
Kotak Abu-abu Siku Lengkung dengan Garis Biru
><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;”>TULISAN DISINI</div>
Kotak Abu-abu Siku Lengkung dengan Garis Merah
><div style=”-moz-border-radius: 10px; -webkit-border-radius: 10px;
background-color: #f3f3f3; border-left: 5px solid #DA1111; border-radius:
10px; padding: 10px; t-align: left;”>TULISAN DISINI</div>
Kotak Hijau Tosca Siku Melengkung
<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;”>TULISAN DISINI</div>
Kotak Background Warna Kuning
<div style=”border: 2px #006400 ridge; padding: 10px; background-color:
GOLD; text-align: left;”>TULISAN DISINI</div>
Kotak Background Kuning Border Putus Pendek
<div style=”border: 2px #006400 dotted; padding: 10px; background-color:
GOLD; text-align: left;”>TULISAN DISINI</div>
Kotak Background Kuning Border Putus Hitam Tebal
<div style=”border: 2px #006400 dashed; padding: 10px; background-color:
GOLD; text-align: left;”> TULISAN DISINI </div>
Kotak Disisipkan Background Kuning
<div style=”border: 2px #006400 solid; padding: 10px; background-color:
GOLD; overflow: auto; height: 50px; width: 600px; text-align:
left;”>TULISAN DISINI </div>
Silahkan ganti kata TULISAN DISINI dengan kata-kata atau kalimat yang ingin kamu tuliskan dalam kotak.
Demikian postingan mengenai cara membuat tulisan dalam kotak di blog. Jangan lupa bagikan satu kebaikan dengan membagikan postingan ini ke media sosial lainnya. Semoga bermanfaat dan terima kasih banyak telah berkunjung dan membaca di blog ini.
