Mengganti Background Blog Dengan Gambar

Crystal Sebuah blog yang cantik dan enak dilihat tentu akan sangat membantu dalam meningkatkan traffic blog kita, karena saya sendiri lebih tertarik mengunjungi sebuah blog yang warnanya cerah dan enak dilihat, daripada blog yang warnanya gelap dan bentuknya tidak karuan alias acak kadut. Walaupun postingannya menarik tetapi membuat sakit mata, lebih baik saya pelototi blog saya selama berjam - jam.

Saya akan berbagi tips sedikit yang saya tahu tentang merubah warna background blog atau mengganti background dengan gambar yang sudah sobat upload ke tempat penyimpanan online, misalnya di Google Sites atau Photobucket.

Berikut langkah - langkahnya :

  • Login ke Blogger.
  • Klik Tata Letak --> Edit HTML.
  • Kemudian cari kode yang mirip seperti ini :

    body { background: #FFFFFF;
    margin:0; color:#000000;
    font:12px trebuchet ms;
    text-align: center }


    Atau jika bingung silahkan klik Ctrl + F kemudian ketikkan body {, biasanya letaknya diatas.

  • Untuk mengganti background dengan warna lain tinggal mengganti kode #FFFFFF dengan kode lain, untuk kode warna bisa dilihat disini. Contoh saya mengganti background dengan warna abu - abu, hasilnya akan menjadi seperti berikut :

    body { background: #D8D8D8;
    margin:0; color:#000000;
    font:12px trebuchet ms;
    text-align: justify }

  • Untuk mengganti background dengan image atau gambar, misalnya gambar yang sudah saya simpan di blogger, kode url-nya seperti ini :

    http://lh4.ggpht.com/_7Y9pl24WpQY/StGOm72nY7I/AAAAAAAAB4c/mWg4brKUK4Q/body_thumb%5B4%5D.jpg?imgmax=800
  • Sehingga hasilnya menjadi seperti berikut ini :

      body { background:#FFFFFF url(http://lh4.ggpht.com/_7Y9pl24WpQY/StGOm72nY7I/AAAAAAAAB4c/mWg4brKUK4Q/body_thumb%5B4%5D.jpg?imgmax=800) repeat-x;
      margin:0; color:#000000; font:12px trebuchet ms;
      text-align: justify}

    • Jika sudah selesai kemudian Simpan Template sobat.

    Untuk gambar yang continuous sobat tambahkan repeat-x setelah kode url gambar. Lebih jelasnya sobat bisa baca postingan saya tentang cara mengganti backgroud blog dengan gradient image disini.

     

    Selamat mencoba ! Thumbs-up

    Berlangganan artikel terbaru via Email
    Artikel Lainnya :

    65 comments

    21 Juni 2009 pukul 23.34

    udah saya link balik..silahkan di cek, thanks

    11 Agustus 2009 pukul 02.55

    makaih brow tips "Mengganti Background Blog Dengan Gambar" cukup bagus,, n brhsl d praktekin d blog aku.....

    11 Agustus 2009 pukul 12.12

    sama2 mas elmubarok..saya juga br belajar kok

    28 Agustus 2009 pukul 01.50

    Thanks infonya...sip nih..

    8 November 2009 pukul 12.54

    setuju mas,saya juga paling ga suka liat blog2 yg gelap,ga ada patromak lagi..emang didalem goa.hehehe...

    12 November 2009 pukul 09.37

    Bang Dody...gemana nech...aku buat tempalate di blog aku tapi hasilnya ngga maksimal? Berantakan!!

    3 Februari 2010 pukul 19.29

    Wah keren sekali triknya,! makasih banyak....

    21 Februari 2010 pukul 22.41

    boz, gmna ne kode body { background: #FFFFFF;
    margin:0; color:#000000;
    font:12px trebuchet ms;
    text-align: center } tidak ada

    22 Februari 2010 pukul 00.01

    @ Evson : cari yg mirip aja karena setiap template beda2, cari aja tag body { trus lihat kode warnanya

    7 Juni 2010 pukul 05.07

    Aku tetep nda bisa mas :(
    cari kode nya dimana

    1 Juli 2010 pukul 23.16

    ini yang aku cari... terima kasih,gan...
    tak cobain nih!

    29 Juli 2010 pukul 21.47

    oalah. ternyata letaknya disitu toh ....

    12 Agustus 2010 pukul 03.54

    oke teman saiya coba dulu.
    bismilah mudah2an berhasil..

    28 Agustus 2010 pukul 22.08

    mskh yachhh
    ^_^

    16 September 2010 pukul 05.42

    ok lah mantav ,ijin sedot gan :))

    27 September 2010 pukul 13.12

    Bos kalo background blog atau web tuh lbar sama tingginya brp x brp yah? trus upload slain di photobucket th dmn aj yh?
    knjungi blog gw yh: http://febyculun.blogspot.com/

    27 September 2010 pukul 16.38

    @Feby : / tinggi tdk ada batasnya, u/ lebar bs sobat lihat blog saya menggunakan lebar 980px. Upload gambar bs di google sites

    11 November 2010 pukul 15.55

    saya sudah membuat banner melalui "Banner 123" (Creator Banner) namun saat saya masukkan ke blog saya kok tidak dapat muncul...
    Bagaimana ya tolong bagi informasinya dong ?

    24 November 2010 pukul 23.56

    kalo cara yang lebih simpelnya ada ga gan??
    oia,,salam kenal gan.. ane masih newbie nih.. minta linkback ya.. hehehe,, trima ksih sblumnya..
    http://jendelagitar.blogspot.com/

    Anonim
    18 Desember 2010 pukul 22.28

    saya akan coba mas...
    semoga berhasil ya

    7 Januari 2011 pukul 21.21

    mo tanya mas,,,bisa gak klo backgroundnya pke gambar format gif biar bsa gerak?

    13 Februari 2011 pukul 01.49

    kk kayk mna kalo pengunjung mau comment...
    blog w gk bisa melulu

    6 Maret 2011 pukul 09.52

    Makasih artikelnya

    14 Maret 2011 pukul 14.41

    MASIH BINGUNG...???...COBANYA....

    18 Maret 2011 pukul 13.01

    Mau coba ahh mengganti warna background blog aku.. makasih infox...

    20 April 2011 pukul 12.49

    tak coba ganti background dengan image, koq gak bisa ya, padahal udah takmasukin url nya dari photobucket, knp ya koq masih tetap

    24 April 2011 pukul 23.11

    aku coba yahhh.....trims

    3 Mei 2011 pukul 19.01

    halosobat semua
    tampbahandarisya si klog di ganti dengan gambar agaknya mempengaruhi dikit loadingnya.akhirnya aku tau juga semua berka blog miscah yang bermurah hati untuk senan tiasa memasang tips terbaiknya tenks buat miscah.blogspot.commoga makin sukses ya

    16 Mei 2011 pukul 01.19

    tanya nih sob, klo misalnya aku pingin ganti body background-nya dengan gambar tp bisa gag strecth..biasanya kan klo cuma 800px ya jadinya segitu nah aku pingin gambar yg 800px td otomatis penuh di background

    16 Mei 2011 pukul 07.08

    @Horier : ditambahkan "repeat-x" contohnya seperti ini :

    body {
    width:980px;
    background:#000 url(http://lh4.ggpht.com/_7Y9pl24WpQY/Ss3-5FwOlwI/AAAAAAAAB20/t0KDHUMkcRA/bg2_thumb%5B1%5D.jpg) repeat-x;
    margin:0 auto;
    padding:0;
    font:12px verdana,arial,trebuchet ms;
    text-align:left;
    color:#333
    }

    19 Juli 2011 pukul 14.53

    Salam kenal mas, thanks atas infonya nih.., siapa tahu kedepannya nanti kalo mau ganti background, ngak perlu susah2 lagi.. :)

    20 Juli 2011 pukul 09.34

    kalo mau. bikin menu kayak home, popular, domain itu kyk mana mas?

    27 Juli 2011 pukul 17.13

    Makasih sob, sangat membantu....

    8 Agustus 2011 pukul 03.38

    Terima kasih tutorialnya sob, sangat membantu bagi saya.

    13 Agustus 2011 pukul 19.34

    matur suwon gan.,.....

    16 Agustus 2011 pukul 00.15

    mancab sob, thx infonya

    3 September 2011 pukul 23.48

    terimakasih komandan,jozzzz

    2 Oktober 2011 pukul 19.59

    mantep makasih inponya

    7 Oktober 2011 pukul 14.23

    berkunjung & numpang mampir baca2 nyua,...

    27 Oktober 2011 pukul 15.12

    kalau mau ganti dengan gambar2 pilihan kita sendiri gmn bos?

    Anonim
    2 November 2011 pukul 19.11

    mampir dimari ya gan,, http://weirdboard.blogspot.com

    21 November 2011 pukul 08.36

    trimakasih info nyaaaa

    4 Desember 2011 pukul 21.13

    Thanks infonya. kebetulan lagi pengen ganti background

    20 Desember 2011 pukul 19.54

    Info yang bermanfaat sekali gan.... thanks banyak....

    7 Maret 2012 pukul 02.16

    wah.. artikel mantapnih .ijin praktekin nih om...

    7 Maret 2012 pukul 02.20

    ini adalah artikel yang pas buat saya untuk menganti background blog saya..

    15 April 2012 pukul 18.54

    kalau misal ingin di bikin transparan gmn gan!..

    18 April 2012 pukul 09.23

    wah mantap infonya

    18 April 2012 pukul 09.24

    langsung ane praktekan gan

    8 Mei 2012 pukul 17.41

    mantap surantap gan

    14 Mei 2012 pukul 13.39

    admin, tahap kedua itu tata letak atau template

    11 Juli 2012 pukul 18.34

    terims infonya

    19 Juli 2012 pukul 02.09

    klo buat blog WP ada ga?

    28 Juli 2012 pukul 21.26

    mantap bos infonya....salam kenal bos,salam persahabatan..

    1 Agustus 2012 pukul 14.03

    boleh juga untuk di coba, ..........

    1 Agustus 2012 pukul 14.05

    sangat bermanfaat sekali artikelnya buat di pelajari,

    16 Agustus 2012 pukul 06.45

    Dari pada warna memang lebih bagus backgroundnya dari gambar
    nice share

    2 September 2012 pukul 09.48
    5 November 2012 pukul 11.52

    Saya coba terapkan gan, trims ya. Ditunggu kunjungannya...

    18 November 2012 pukul 18.56

    Izin coba Sobat ,,,

    20 Desember 2012 pukul 15.46

    Blog ane malah tiap postingan background dan desainnya ganti kang, jadi kagak ngebosenin.... :D

    30 Desember 2012 pukul 21.14

    kalau buat backroundnya transparan bagaimana?

    1 Januari 2013 pukul 15.51

    bingung -_-

    Makasih informasinya..
    Saya bakalan coba dan pelajari..

    14 Mei 2013 pukul 15.07

    jadi lebih rame nih blog nya pake gambar backgroundnya.

    Internet Marketing

    Posting Komentar

    Reader Community

    Recent Comments