Skip to content Skip to sidebar Skip to footer

Cara Membuat Gambar Berjajar Dengan Teks

Gambar merupakan pelengkap dari sebuah postingan atau artikel. Tanpa gambar rasanya sebuah postingan seperti masakan tanpa garam. Untuk menampilkan gambar dengan ukuran besar/penuh adalah soal mudah. Tetapi bagaimana jika karena alasan tertentu penulis ingin menampilkan gambar dengan ukuran kecil. Maka akan nampak ruang kosong disisi kanan dan sisi kiri gambar. Jika dipaksakan tentu hasilnya akan kurang menarik, tidak efisien dan terlihat tidak indah dipandang. Maka solusinya adalah mengisi ruang kosong disebelahnya dengan teks postingan.

Bagi blogger pemula membuat gambar berjajar dengan teks pada halaman postingan boleh jadi masih belum tahu atau mungkin masih membingungkan. Hal ini kelihatannya sepele, tetapi kesan awal ini penting agar pembaca tertarik untuk melanjutkan bacaannya.

Bagaimana caranya, mari kita ikuti langkah-langkahnya:

1. Masuk ke halaman statis pada dasbor blog untuk membuat alamat URL gambar yang akan kita posting. Pastikan ada diposisi tampilan HTML. Upload gambar kemudian copy alamat URLnya. Jangan lupa simpan halaman statis sebagai draft.
Gambar 1
2. Masuk ke halaman postingan. Pastikan pula ada pada tampilan HTML. Kemudian copy Script dibawah ini.

<div style="align: justify;">
<img src="http://xxxx" width="150"height="140" style="float:left; margin: 0px 9px 3px 0px;" /> Teks postingan

Keterangan:
* Ganti "alamat URL gambar ( http://xxxxx )" dengan alamat URL gambar yang sudah kita buat di halaman statis (gambar 1).
* Ubah width (lebar) dan height (tinggi) gambar sesuai kebutuhan.
* Ubah "float:left;" sesuai dengan kemauan anda. Jika menginginkan gambar ada di kanan ubah left dengan right. Jika ditengah ganti dengan center.
* Margin adalah jarak antar elemen/tag HTML dari segala arah yang ditandai dengan angka dan px (pixel). Dimulai dari top/atas searah jarum jam. Edit angka pada margin diatas sesuai dengan kebutuhan anda.
* Ubah dari posisi tampilan HTML ke tampilan Menulis atau Compose.

Setelah semua tahapan selesai baru anda menulis postingan disamping gambar. Tulisan seperti ini biasanya banyak kita jumpai pada majalah, koran , buku dll untuk menghemat ruangan. Untuk memastikan semua sudah rapi lihat pratinjau sebelum dipublikasikan. Selesai. Demikian tutorial bagaimana cara membuat gambar berjajar dengan teks. Semoga bermanfaat.
Nur Hakim
Nur Hakim Fokus adalah salah satu kiat untuk sukses

Post a Comment for "Cara Membuat Gambar Berjajar Dengan Teks"