Background images not showing

  • Resolved mk13

    (@mk13)


    14 years, 10 months ago

    I’ve downloaded wordpress to my computer and am trying to make a theme from scratch. I cannot get any background images to show up. I’ve made a folder inside my theme folder named images. One example is my header image, in my style.css I used:

    #header{
    margin: 0;
    border: 0;
    padding: 0;
    float: left;
    width: 750px;
    height: 124px;
    background-image: url(‘<?php bloginfo(‘stylesheet_directory’); ?>/images/navigation_top.jpg’) no-repeat top left;
    font-family: “Baskerville Old Face”, “Times New Roman”, Serif;
    font-size: 1em;
    }

    and in my header.php:

    <div id=”header”>
    < ul > (without the spages)
    <?php wp_list_pages(‘depth=1&title_li=’); ?>
    < /ul >
    </div> <!–id header–>

    I cannot get the background image to show up anywhere else either. I have tried inside body{} and other divs.

    However when I use the image tag, for example:

    <img src=”<?php bloginfo(‘stylesheet_directory’); ?>/images/navigation_top.jpg” />

    It is working fine. Please help.

Viewing 7 replies - 1 through 7 (of 7 total)

  • You can’t execute php in a css file without different server settings to parse the css file for php; this won’t work:

    background-image: url('<?php bloginfo('stylesheet_directory'); ?>/images/navigation_top.jpg') no-repeat top left;

    In style.css, do this instead:

    background-image: url(images/navigation_top.jpg) no-repeat top left;

    and change the path if your image folder is wp-content/themes/images/navigation_top.jpg rather than the theme folder itself, wp-content/themes/mytheme/images/navigation_top.jpg

    Thread Starter mk13

    (@mk13)

    This is also not working =(
    I’ve named my theme ‘test’. When I type this into the browser the image shows up:

    https://localhost/wordpress/wp-content/themes/test/images/navigation_top.jpg

    I have tried every combination of the above and it doesn’t work.
    But I didn’t know about the php inside css, thankyou =)

    Try the full image path in style.css

    Thread Starter mk13

    (@mk13)

    Yes I have tried that too.
    When I view the page source the image is not there at all.

    I missed something; it shouldn’t be background-image. try: 

    #header{
margin: 0;
border: 0;
padding: 0;
float: left;
width: 750px;
height: 124px;
background: url(images/navigation_top.jpg) no-repeat top left;
}
    Thread Starter mk13

    (@mk13)

    This worked, thankyou very much!
    How strange that background works but background-image doesn’t @_@

    Like any code, CSS rules are pretty strict….

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Background images not showing’ is closed to new replies.