Cara Memberi Background Gambar pada Posting Blog

14 Mar 2011



Tips Trik Blogger Iseng dari Mari Berkawand kali ini akan berbagi trik menarik
yaitu Cara Memberi Background Gambar pada Posting yang berbeda-beda background di setiap postingan, tanpa merubah Template.
Mungkin trik ini sudah banyak yang mengetahui, makanya trik kali ini saya khususkan bagi yang belum mengetahui trik ini dan jiaka ada yang berminat untuk memodifikasi postingan di setiap memposting.
Untuk Demonya, Kawand bisa lihat sendiri backgroundnya pada postingan ini, dan hanya pada postingan ini saja tidak merubah background postingan keseluruhan blog ini
Berikut cara pembuatan nya :


Tambahkan kode dibawah ini pada editor Edit HTML postingan blog sobat:


<div style="background: url(https://lh5.googleusercontent.com/_
mvggGxDFYEk/TJYgTmkkhQI/
AAAAAAAAANU/5oi8bfbIzcc/inidia.jpg
) no-repeat; 
color:#000; 
padding:10px 10px 10px 10px; 
-moz-border-radius-topright:10px; 
-webkit-border-top-right-radius:10px; 
-moz-border-radius-bottomright:10px; 
-webkit-border-bottom-right-radius:10px; 
-moz-border-radius-topleft:10px; 
-webkit-border-top-left-radius:10px; 
-moz-border-radius-bottomleft:10px; 
-webkit-border-bottom-left-radius:10px;"> 

Isi Postingan
</div>

Keterangan :
Ganti URL gambar diatas dengan URL gambar milik Kawand-Kawand.

Kode no-repeat adalah kode untuk tidak menampilkan gambar berulang-ulang, jika memang menghendaki gambar yang ditampilkan berulang sampai ke bawah postingan, maka tinggal dihapus saja kode no- pada kode tersebut
Isi Postingan adalah isi dari artikel/post sobat keseluruhan. jadi integrasinya kode diatas adalah mengapit keseluruhan isi artikel milik sobat. 
Sebelum posting tersebut diterbitkan, maka sebelumnya di Pratinjau terlebih dahulu.
Setelah semuanya beres, maka terbitkanlah postingan sobat. dan lihat hasilnya.

Satu postingan sobat memiliki background yang berbeda.

Selamat mencoba
SaLaM BERKAWAND.
Share this article on :

3 comments:

Anonymous said...

http://www.masdoyok.co.cc/2010/01/membuat-sub-judul-di-postingan.html

baburinix! said...

thank infonya

loekman's caem said...

gan emg gambar nya harus https ya
salam loekman

Post a Comment

 
© Copyright 2010-2011 Mari Berkawand All Rights Reserved.
Template Design Premium | Powered by Blogger.com.