Membuat Background Gambar di Postingan Blog

Menampilkan Background gambar atau image background pada postingan blog akan membuat lebih menarik tampilan posting. Setelah artikel saya sebelumnya membuat bingkai tulisan di postingan, kali ini saya akan menjelaskan cara membuat background gambar pada tulisan yang akan kita posting. Untuk membuat latar belakang gambar posting, harus dilakukan pada bagian Edit HTML saat membuat postingan karena di sana akan ditambahkan beberapa kode latar belakang (image background).

Membuat backgroud gambar pada postingan

Seperti pada tutorial blog yang lain langkah pertama ya mesti login ke account blogger dulu. Kemudian masuk ke posting, pilih new post dan pilih Edit HTML. Berikut ini adalah kalimat yang akan diberi latar belakang gambar:

Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius),  tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.

Kalau sudah, di bawah ini contoh kode untuk membuat background gambar :

<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

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/AVvXsEipkF-Wen3hakk-ESZ-1H-nUbANw2JuJlw9B19YGROLpSR0-TO5CZlpDMNLReg4h90GZD8uvMx3OH9w8ctDXPUcXB1OxJl7dVcFTeRG7bAOtH_Jz0QPZitpjWCmihvHivzvufZ7J3ohI38/s1600/mirror+maskolis.jpg

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/AVvXsEipkF-Wen3hakk-ESZ-1H-nUbANw2JuJlw9B19YGROLpSR0-TO5CZlpDMNLReg4h90GZD8uvMx3OH9w8ctDXPUcXB1OxJl7dVcFTeRG7bAOtH_Jz0QPZitpjWCmihvHivzvufZ7J3ohI38/s1600/mirror+maskolis.jpg) no-repeat;”>

Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius),  tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.

Dan ini adalah hasil lengkap posting dengan image backgroud:

Saya secara pribadi memperbolehkankan blog saya ini dikopi paste atau disalin ke blog teman-teman yang lain. Nggak mencantumkan link sumbernya juga nggak pa-pa. Saya nggak bakal lapor ke Bos Google (serius), tapi saya nggak bisa tanggung akibat yang lain (kreativitas teman-teman sendiri nanti yang akan tidak berkembang). Saya sendiri pun nggak yakin sama blog saya ini blog spam atau bukan. Bisa jadi besok saya udah nggak bisa posting lagi karena udah kena banned sama Bos Google karena tulisannya nggak karuan atau dilaporkan sama orang lain.

Bagaimana, sangat sederhana bukan? Kode di atas masih bisa ditambah lagi atau dimodifikasi seperti misalnya mengatur jarak ke tepi posting, besar huruf, dan perataan kalimat, tergantung selera saja. Semoga temen-temen tidak kesulitan dan selamat mencoba…

Posted in: Blog