1. Halo Guest, pastikan Anda selalu menaati peraturan forum sebelum mengirimkan post atau thread baru.

[tanya] ganti background pake gambar kita sendiri

Discussion in 'Blogger/Blogspot' started by amandawarat, Mar 15, 2008.

  1. amandawarat

    amandawarat Newbie

    Joined:
    Mar 15, 2008
    Messages:
    2
    Likes Received:
    0
    nanya dong gimana caranya ganti background di blogger pake gambar kita sendiri
    kalo ada yang tau kasi tau yahhhhhhh !!!


    ARIGATOU GOZAIMASU
     
  2. gl0ucester

    gl0ucester Momod Banned Permanent

    Joined:
    Jul 14, 2006
    Messages:
    2,314
    Likes Received:
    1,795
    Location:
    Koto Anau
    log in to your dashboard layout; under Template -> Edit HTML, scroll to where you see this:-

    body {
    background:$bgcolor;

    Change background color

    If you would like to change the background color of your blog to a very unique color, you can manually specify the color value. Search online for color codes, or take a look at the HTML Color Chart to see if you can find your desired color. For example, if you have chosen a color code #B38481, change the above code to this:-

    body {
    background-color:#B38481;


    If you are changing the background color of your sidebar only, add the color code under the relevant sidebar heading.

    #sidebar-wrapper {
    background-color:#B38481;


    Similarly, if you want a different color for your main post column, add the color code as follows:-

    #main-wrapper {
    background-color:#B38481;


    Note that different templates may label their stylesheets differently. The #sidebar-wrapper may be called #side-wrap or something to that effect.

    In some templates like the TicTac Template, the background color you see is due to a background image and inserting a color code into the template will not help. To have a different color, this background image will have to be edited. For more details, read the article on Background Color of TicTac Template.

    Add a background image

    The code to insert is this:-

    body {
    background-image: url(URL address of your image);


    Remember to insert the URL address of your image in the brackets. If you would like to have a feel of how a background picture will look like, I have uploaded a test image at this address – http://i154.photobucket.com/albums/s255/ownlblog/narutosasuke1024x768.jpg

    Insert the URL of this test image into the above brackets and Preview your blog.

    You can also have a background image just for your sidebar. Locate the style and add the background image code accordingly.

    #sidebar-wrapper {
    background-image: url(URL address of your image);


    For a background image to your main post body only, add the code here:-

    #main-wrapper {
    background-image: url(URL address of your image);


    Repeat background image

    By default, the image is repeated to fill up the entire background of the page. If you have a small or tile-sized image, it will appear like a print pattern in the background. Sometimes, you may choose not to have the image repeated. If that is the case, you can insert this code:-

    background-repeat: no-repeat;


    Alternatively, you may only want the image to be repeated horizontally. The code is this:-

    background-repeat: repeat-x;


    To have the image repeated vertically, the code is this:-

    background-repeat: repeat-y;


    Position background image

    If you have an image that is not repeated, you may like to specify the exact position of this image on your page. The HTML code to be inserted is this:-

    background-position: top left;


    Your image will appear at the top left corner of your page. The other possible values that you can use to replace “top left” are:-

    top center;
    top right;
    center left;
    center center;
    center right;
    bottom left;
    bottom center;
    bottom right;

    If you do not want it entirely left, right or center, you can also define the horizontal and vertical alignments either in percentage or in pixels. Use either of these values instead, with x being the horizontal value and y being the vertical value.

    x% y%;
    xpx ypx;

    Static background image

    After that, you may specify whether you want your background image to remain in a fixed position when the contents of your blog are scrolled. By default, the picture scrolls with your content. To have it stay put, the code to insert is this:-

    background-attachment: fixed;


    selengkapnya.......


    http://tips-for-new-bloggers.blogspot.com/2007/03/background-image-for-blogger-template.html
     

Share This Page