Menu

Mode Gelap
Arti Kata Bosor Makan Menurut KBBI Arti Kata Bosor Menurut KBBI dan Contoh Kalimat Arti Kata Bosman Menurut Kamus Besar Bahasa Indonesia (KBBI) Arti Kata Boseta Menurut Kamus Besar Bahasa Indonesia (KBBI) Arti Kata Kebosanan Menurut Kamus Besar Bahasa Indonesia (KBBI) Arti Kata Pembosan Menurut Kamus Besar Bahasa Indonesia (KBBI)

teknologi

Cara Membuat Text Box di Blogger.com

khoiribadge-check

 Membuat kotak seperti text box sangat berguna di dalam proses penulisan kita di halaman website atau blog kita. pada blogger.com atau hosting blogspot memang tidak disediakan menu text box atau Insert shape sebagaimana pada Microsoft Word

Namun blogger.com menyediakan fitur HTML untuk kita bisa membuat kotak yang berfungsi seperti text box pada Microsoft word. Dimana text box pada Microsoft Word berfungsi untuk menyisipkan kotak yang dapat di isi dengan teks atau tulisan atau gambar. Pada Langkah di bawah, kami akan menunjukkan cara membuat kotak yang berfungsi seperti  text box untuk memuat tulisan dan gambar di hosting blogspot atau blogger.com.

Bagaimana Cara Membuat Text box di blogger.com?

Ikuti setiap Langkah di bawah secara seksama untuk membuat kotak di blogger.com :

  1. Buka postingan baru dengan klik new post
  2. Klik html View pada tanda pensil di ujung kiri
    Cara Membuat Text Box di Blogger.com
    gambar 1.0. Klik HTML View

     

  3. Masukkan kode  di dalam kurung ini <div style=”background-color: white; border: 3px groove rgb(0, 0, 0); height: 100px; overflow: auto; padding: 10px; text-align: center; width: 455px;”><span style=”text-align: justify;”>Ganti Tulisan ini</span></div>
    Cara Membuat Text Box di Blogger.com
    Gambar 1.1 Masukkan kode untuk membuat Text Box

     

  4. Klik Compose View untuk melihat hasil perubahan tersebut.
    Cara Membuat Text Box di Blogger.com
    gambar 1.2 Klik Compose View dan anda bisa melihat hasil koding tersebut

     

Demikianlah cara membuat text box di blogger.com disertai dengan langkah-langkahnya.

Lalu saudara mungkin ingin bertanya apa penjelasan dari kode tersebut?

Berikut adalah penjelasannya

<div style=”background-color: white; border: 3px groove rgb(0, 0, 0); height: 100px; overflow: auto; padding: 10px; text-align: center; width: 455px;”><span style=”text-align: justify;”>Ganti Tulisan ini</span></div>

  1. Div style merupakan kumpulan kode, anda tidak perlu merubah ini
  2. background-color: white = warna latar belakang adalah putih, anda bisa merubah menjadi biru, missal background-color: blue.
  3. border: 3px groove rgb(0, 0, 0) = border artinya batas dengan ukuran 3 px, anda bisa merubah sesuai kebutuhan anda. Adapun groove merupakan jenis bentuk kotak, anda bisa merubahnya menjadi dashed, dotted atau solid.
  4. Height:100px = ukuran ketinggian text box 100 px, anda bisa merubah sesuai kebutuhan anda.
  5. Overflow = kode untuk membuat kotak bisa discroll ke atas kebawah
  6. text-align: center = perataan tulisan rata tengah, anda bisa merubahnya menjadi rata kiri, misal  text-align: left.
  7. width: 455px; = lebar 455 px, anda bisa merubah sesuai kebutuhan anda.
  8. </div> = merupakan kode script untuk menutup kelompok kumpulan kode, anda tidak perlu merubah kode ini.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Baca Lainnya

Nevacloud vs Linode: Solusi Cloud untuk Bisnis Skala Menengah di Indonesia

16 November 2025 - 08:59 WIB

Nevacloud vs Linode: Solusi Cloud untuk Bisnis Skala Menengah di Indonesia

Cara cek (melihat) waktu kadaluarsa shampo Clear

29 Oktober 2025 - 08:36 WIB

Cara cek (melihat) waktu kadaluarsa shampo

Cara jual beli saham secara cepat (hitungan jam)

25 Oktober 2025 - 20:52 WIB

Cara mengubah file pdf ke Word dengan ChatGPT

20 Oktober 2025 - 08:34 WIB

Cara mengubah file pdf ke Word dengan ChatGPT

Cara Transfer uang dengan BI Fast dari JConnect Bank Jatim ke BRI Mobile

18 Oktober 2025 - 16:45 WIB

Trending di ekonomi