Menu

Mode Gelap
Harga emas kembali tembus 4300 US Dollar per ounce atau 138 US Dollar per gram di malam 21 Oktober 2025 Video bermain layang-layang di sawah sore hari Bentuk fi’il mudhori kata (عَبَدَ) ‘Abada adalah … Bentuk jamak kata (دِيْنٌ) dinun adalah … Bentuk jamak kata (حَلَقَةٌ) halaqotun adalah … Bentuk jamak kata (طِيْبٌ) Tibun adalah

Informasi

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

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

Dijual PC Gaming di Tarakan dengan spesifikasi mantab

6 Oktober 2025 - 10:25 WIB

Dijual PC Gaming di Tarakan dengan spesifikasi mantab

10 Tips bermain valas (mata uang asing) dan pengertiannya

6 Oktober 2025 - 09:28 WIB

Cara melihat waktu kadaluarsa Milo kemasan sachet 

2 Oktober 2025 - 14:07 WIB

Trending di Berita