background images (9 posts)

  1. krez
    Posted 9 years ago #

    I've found the files necessary to edit in order to change the appearance of my theme: in the wp-content > themes > default > images folder.

    Now what I want to do is use a .gif for one of these instead of a .jpg. Does anyone know where WordPress calls these files from? In other words, what code do I have to change in order to tell it to look for a different image file than the one it currently looks for?

  2. Alex Cragg
    Posted 9 years ago #

    it'll more than likely be in the css file. as an example, it might look like this

    #header {background: url(/images/head.gif); }

    just change the file at the end

  3. krez
    Posted 9 years ago #

    in particular i'm looking for the file called kubrickbg.jpg.

    can't find it in the css file.

  4. Alex Cragg
    Posted 9 years ago #

    sure you don't mean kubrickbgcolor.jpg
    that is here...

    body {
    	font-size: 62.5%; /* Resets 1em to 10px */
    	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
    	background: #d5d6d7 url('images/kubrickbgcolor.jpg');
    	color: #333;
    	text-align: center;

    that is just the greyy background, the header picture is kubrickheader.jpg

    i cant find it anywhere as just kubrickbg.jpg...
    what is the image of?

  5. krez
    Posted 9 years ago #

    kubrickbg.jpg is the image that sets the background for where the text goes in your blog. it's 760 pixels wide, allowing you to make custom borders. i've posted a copy of this file here, just for your reference:


  6. Alex Cragg
    Posted 9 years ago #

    ok, found it
    for some reason it isnt in the main css, but there is another one added on, but i can't find where it exists...it just seems to do so!!! someone else might be able to help you more, as i dont use this theme, but i think if you do this for now it should work:

    add this to the #page part of your css

    background: url("http://mydomain.com/wp-content/themes/default/images/kubrickbg.jpg") repeat-y top !important; }

    obviously changing to the new file name.

    the !important bit makes that statement override any others with the same tag.
    so it should replace the other bit which is separate.

    as i say, there might be a better fix

  7. krez
    Posted 9 years ago #

    that seems to work. thank you. though i've now run into an additional problem. the point of this whole thing is so that i can add a border of sorts to both the left and right side of the blog (see the screen cap below for an idea). so what I did is, in the STRUCTURE section of the css file, under #page, i changed:

    width: 760px

    width: 932px

    This should accomodate for the new, wider border. But the result achieved is not quite right, viewable at the following screen cap that i took:


    It's obvious what i'm trying to achieve here from looking at it. The problem is also pretty obvious! How do I get the content of the site to line up properly with the new, wider border image?

  8. krez
    Posted 9 years ago #

    nevermind -- i did some tinkering in the css file and figured it out. had to change the margins in the body, sidebar, and header areas. thanks for all your help!

  9. Alex Cragg
    Posted 9 years ago #

    ive found the proper way to change this, without the !important function in the css.

    open your header.php, and look for this, its the bit i couldnt find before

    #page { background: url("<?php bloginfo('stylesheet_directory'); ?>/images/kubrickbg.jpg") repeat-y top; border: none; }

Topic Closed

This topic has been closed to new replies.

About this Topic