[Tutorial] Cara Membuat Kotak Teks/Script Pada Postingan Blog
[Tutorial] Cara Membuat Kotak Teks/Script Pada Postingan Blog - Kali ini BiteBrands akan menyajikan tutorial atau cara membuat kotak teks yang biasanya sering dipakai untuk menampilkan kode atau script. Kotak teks sangat diperlukan terutama untuk memisahkan dan membedakan kode dengan teks lainnya. Dengan kotak teks, kode tidak tercampur dengan teks lain sehingga postingan tutorial sobat akan terlihat rapi dan bersih.
Tutorial cara membuat teks dalam kotak ini cepat dipahami dan mudah dipraktikkan oleh sobat yang ingin membuat postingan di Blospot. Umumnya teks dalam kotak sering dipakai pada postingan tutorial blogging dan sobat pun bisa langsung mencobanya. Kotak teks akan menampilkan garis bagian luar atau border yang berwarna dan bisa diatur tampilannya.
2. Masuk ke dalam HTML pada form postingan
3. Kopi kode/script berikut ini ke bagian dalam HTML pada postingan
4.Masuk ke dalam Compose, dan lihat perbedaannya, klik dalam teks, lalu hapus Klik di Sini, dan ganti dengan teks yang sobat inginkan
Keterangan:
border: 3px = Ketebalan kotak teks
inset = Tampilan kotak bagian luar atau border
selain inset ada pula: dashed, dotted, Double, groove, solid, outset, ridge
padding: 10px = Panjang kotak ke bawah, untuk lebarnya otomatis sampai ke ujung posting
background-color:#ffffff = Warna garis luar kotak atau border
text-align: left = Perataan teks, selain left bisa sobat ganti dengan center atau right
Jika kode yang dipasang pada postingan terlalu panjang, maka sobat perlu membuat kotak teks yang mempunyai scroll agar postingan terlihat ringkas. Untuk membuat kotak teks dengan scroll, lakukan langkah-langkah seperti di atas, namun dengan kode berikut ini.
Demikian, tutorial cara mudah dan cepat membuat kotak teks atau kode script pada postingan Blogger. Silakan mencoba dan semoga bermanfaat bagi sobat sekalian. (bitebrands)
Tutorial cara membuat teks dalam kotak ini cepat dipahami dan mudah dipraktikkan oleh sobat yang ingin membuat postingan di Blospot. Umumnya teks dalam kotak sering dipakai pada postingan tutorial blogging dan sobat pun bisa langsung mencobanya. Kotak teks akan menampilkan garis bagian luar atau border yang berwarna dan bisa diatur tampilannya.
Turorial Membuat Kotak Teks
1.Masuk ke akun Blogger, klik Entri Baru2. Masuk ke dalam HTML pada form postingan
3. Kopi kode/script berikut ini ke bagian dalam HTML pada postingan
<div style="border: 3px #1780dd inset; padding: 10px;background-color:#ffffff;
text-align: left;">
Klik di Sini.</div>
text-align: left;">
Klik di Sini.</div>
4.Masuk ke dalam Compose, dan lihat perbedaannya, klik dalam teks, lalu hapus Klik di Sini, dan ganti dengan teks yang sobat inginkan
Keterangan:
border: 3px = Ketebalan kotak teks
inset = Tampilan kotak bagian luar atau border
selain inset ada pula: dashed, dotted, Double, groove, solid, outset, ridge
padding: 10px = Panjang kotak ke bawah, untuk lebarnya otomatis sampai ke ujung posting
background-color:#ffffff = Warna garis luar kotak atau border
text-align: left = Perataan teks, selain left bisa sobat ganti dengan center atau right
Jika kode yang dipasang pada postingan terlalu panjang, maka sobat perlu membuat kotak teks yang mempunyai scroll agar postingan terlihat ringkas. Untuk membuat kotak teks dengan scroll, lakukan langkah-langkah seperti di atas, namun dengan kode berikut ini.
<div style="background-color: white; border: 3px #1780dd inset; height: 30px; overflow: auto; padding: 10px; text-align: left; width: 400px;"> Klik di sini, Ganti dengan teks yang sobat inginkan</div>
Demikian, tutorial cara mudah dan cepat membuat kotak teks atau kode script pada postingan Blogger. Silakan mencoba dan semoga bermanfaat bagi sobat sekalian. (bitebrands)
Loading...
Post a Comment