Friday, March 22, 2013

Cara Mengganti Background Blog Dengan Gambar

Berikut Cara Mengganti Background Blog Dengan Gambar

  1. Silahkan cari kode-kode berikut untuk mengganti background blog dari setiap elemen blog yang akan diganti backgroundnya
  2. Background Blog Keseluruhan
    Cari kode body {
    Letakkan kode background: url(pasang link gambar background disini) repeat-y center; diantara kode body yang telah ada
    Hasilnya
    body {
    color: #000000;
    background: url(pasang link gambar background disini) repeat-y center;
    ---
    }
  3. Background Judul
    Cari kode #header-wrapper {
    Letakkan kode background: url(pasang link gambar background disini) repeat-x scroll left bottom; diantara kode #header-wrapper yang telah ada
    Hasilnya
    #header-wrapper {
    background: url(pasang link gambar background disini) repeat-x scroll left bottom;
    height:90px;
    width:100%;
    }

    Catatan: Beberapa template ada yang menggunakan #header-outer, #header-inner
  4. Background Posting atau Artikel Blog
    Cari kode #main-wrapper {
    Letakkan kode background: url(pasang link gambar background disini)repeat-y; diantara kode #main-wrapper yang telah ada
    Hasilnya
    #main-wrapper {
    background: url(pasang link gambar background disini)repeat-y;
    float:left;
    ----
    }

    Catatan: Beberapa template ada yang menggunakan #content-wrapper
  5. Background Diluar Area Posting
    Cari kode #outer-wrapper {
    Letakkan kode background: url(pasang link gambar background disini)none repeat scroll 0 0; diantara kode #outer-wrapper yang telah ada
    Hasilnya
    #outer-wrapper {
    background: url(pasang link gambar background disini)none repeat scroll 0 0;
    border:1px solid #000;
    ---
    }

    Catatan: Beberapa template ada yang menggunakan #inner-wrapper
  6. Background Sidebar
    Cari kode #sidebar h3{
    Letakkan kode background:#9F9E9E url() repeat-x top;letter-spacing:-.001em;font:normal 12px Arial;color:#eee; diantara kode #sidebar yang telah ada
    Hasilnya
    #sidebar h3{
    background:#9F9E9E url() repeat-x top;letter-spacing:-.001em;font:normal 12px Arial;color:#eee;
    ---
    }

    Catatan: Beberapa template ada yang menggunakan #sidebar h2, .sidebar h2, .sidebar h3
  7. Background Footer
    Cari kode #footer{
    Letakkan kode background: url() repeat-x scroll bottom;font:normal 12px Arial; diantara kode #footerr yang telah ada
    Hasilnya
    #footer{
    background: url() repeat-x scroll bottom;font:normal 12px Arial;
    ---
    }

    Catatan: Beberapa template ada yang menggunakan #footer-wrapper, .footer

Jika semua kode yang anda cari tidak ada didalam template blog anda, silahkan sesuaikan dengan nama elemen yang anda cari. Misalnya body, header, sidebar, main, content, dan footer. Dan jika masih belum menemukan kode-kodenya silahkan baca artikel berikut ini Cara Mengetahui Kode Template Blog Secara Profesional

Terimakasih, semoga artikel ini bermanfaat dan memudahkan kita dalam mengedit blog kita. Jika ada pertanyaan, silahkan tinggalkan komentar untuk artikel ini, Cara Mengganti Background Blog Dengan Gambar

No comments:

Post a Comment