Image Background Pada Posting Blog

Background gambar atau image background pada posting blog akan mempercantik tampilan posting. Contohnya dapat dilihat pada posting saya tentang Indonesia Merdeka. Untuk membuat latar belakang gambar posting, harus dilakukan pada bagian Edit HTML saat nge-posting karena di sana akan ditambahkan beberapa kode latar belakang (image background). Nah, saya sangat terinspirasi dan termotivasi oleh pertanyaan sobat Bhakti seperti ini "caranya buat postingan berbackground kayak postingan di atas ntuh gimana sih??" akhirnya saya pun membuat posting-an tentang membuat image background pada posting. Saya ini seneng bangat jika ada yang nanya. He..he.. Bila ada teman lain yang juga tertarik, dapat mengikuti cara di bawah ini:

Membuat image backgroud pada posting
Seperti yang sudah dijelaskan di atas, masuklah ke posting dan pilih Edit HTML. Oke, berikut ini adalah kalimat yang akan diberi latar belakang gambar:

Ini adalah contoh posting yang akan diberi image background atau latar belakang gambar pada posting blog. Tujuannya adalah untuk mempercantik tampilan posting dengan dengan latar belakang gambar yang berbeda. Karena saat ini Indonesia masih dalam suasana kemerdekaan, maka saya membuat latar belakang dengan nuansa merah putih dengan logo Google Indonesia's Independence Day, agar semangat kemerdekaan bangsa ini tetap terjaga. Jayalah Indonesia-ku. Merdeka..!!

Nah, kode untuk membuat image background adalah ini:

<div style="background:url(image url address) no-repeat;">
Di sini Anda dapat ketik kalimat yang akan dibuat. Contohnya sudah saya siapkan di atas. Tutup posting dengan kode berikut
</div>

Kemudian ganti image url address dengan alamat gambar yang sudah disiapkan. Kalau saya biasa hosting image di blogger atau pakai photobucket image hosting. Tergantung situasi dan kondisi bandwidth. Misalnya saya mengambil image url address untuk contoh di bawah adalah seperti ini:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLP_F6bLJdjoFipIaceqtbr8dFLLjIkPTAvy6BAlMOamqDkjFdVWW13Nmt2BYTcatV7DKhr0oieNyIUL9CQsCURzcW_M8W_s8_VwQkDuLf0Q_dOkuNSkK2semheb5NZZvkmanu3FrW-ayM/s800/google+logo+indonesia.gif

Sehingga secara lengkap penulisan kode background dan kalimat di posting menjadi seperti di bawah ini:

<div style="background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLP_F6bLJdjoFipIaceqtbr8dFLLjIkPTAvy6BAlMOamqDkjFdVWW13Nmt2BYTcatV7DKhr0oieNyIUL9CQsCURzcW_M8W_s8_VwQkDuLf0Q_dOkuNSkK2semheb5NZZvkmanu3FrW-ayM/s800/google+logo+indonesia.gif) no-repeat;">

Ini adalah contoh posting yang akan diberi image background atau latar belakang gambar pada posting blog. Tujuannya adalah untuk mempercantik tampilan posting dengan dengan latar belakang gambar yang berbeda. Karena saat ini Indonesia masih dalam suasana kemerdekaan, maka saya membuat latar belakang dengan nuansa merah putih dengan logo Google Indonesia's Independence Day, agar semangat kemerdekaan bangsa ini tetap terjaga. Jayalah
Indonesia-ku. Merdeka..!!
</div>

Dan ini adalah hasil lengkap posting dengan image backgroud:

Ini adalah contoh posting yang akan diberi image background atau latar belakang gambar pada posting blog. Tujuannya adalah untuk mempercantik tampilan posting dengan dengan latar belakang gambar yang berbeda. Karena saat ini Indonesia masih dalam suasana kemerdekaan, maka saya membuat latar belakang dengan nuansa merah putih dengan logo Google Indonesia's Independence Day, agar semangat kemerdekaan bangsa ini tetap terjaga. Jayalah Indonesia-ku. Merdeka..!!

Bagaimana, sangat sederhana bukan. Nah, kode di atas masih bisa ditambah lagi atau di-modifikasi seperti misalnya mengatur jarak ke tepi posting, besar huruf, dan perataan kalimat, tergantung selera saja. Semoga semuanya bisa membuat image background pada posting yah..

Related Post:

Trik Blogspot

• Menambahkan Image Pada Judul Posting
• Mengganti Pager Link Blogger Dengan Icon
• Klik Label Tampil Hanya Judul Posting Update
• Klik Label Tampil Hanya Judul Posting
• Menambahkan Icon Pada Label Dan Link Sidebar
• Mengganti Tanggal Dengan Icon Kalender
• Menghilangkan Icon QuickEdit (Tang dan Obeng)
• Area Sidebar Dalam Kotak Terpisah
• Area Komentar Dalam Kotak Terpisah
• Area Posting Dalam Kotak Terpisah
• Background Warna Pada Teks Posting
• Modifikasi Pesan Pengantar Formulir Komentar
• Beda Tampilan Komentar Pemilik Blog
• Nomor Urut Komentar (Numbering Comment) Blogger
• Pasang Emoticon Di Atas Kotak Komentar
• Membuat Blockquote Dan Modifikasi Blockquote
• Masalah Pada Verifikasi Kotak Komentar
• Membuat Teks Berkedip Blink Text
• Membuat Horizontal Navigasi Blogger
• Avatar Profil Komentar Blogger Update
• Latar Belakang Teks Dengan Efek Stabilo
• Menggunakan Gambar Untuk Latar Belakang Blog
• Pasang Strip-Ad Seperti Navbar Blogger
• Menghilangkan Border Pada Image Posting
• Modifikasi Border Photo Profil Blogger

or or