Support » Fixing WordPress » image paths and very basic template questions

  • I’m almost embarrassed to ask, as a noobie sometimes you can’t see the wood for the trees.
    I’m following the css tutorial and want to experiment with adding an image in the header. I have uploaded the image to the wp-images folder. What format should the pathway to this file have in the command:
    background-image: url (‘ ‘);
    I can’t get the image to show up?
    Also, I wanted to use the gemini template as a starting point, but should I understand that the section ‘masthead’ replaces the section ‘header’ in the default template?
    Finally, it best to import my entries from blogger first, or to tweak the template until I’m happy and then import?

Viewing 7 replies - 1 through 7 (of 7 total)
  • In your case it should be, I think, url(‘wordpress/wp-images/myheaderimage.jpg’) . Or use the full path: url(‘http://petite-anglaise.com/wordpress/wp-images/….jpg’).
    If I remember right, Root uses #masthead for the blog header div.
    As for importing first or later, it doesn’t really matter. Once you’ve defined your basic stylistic choices, you could import in order to see the effect of your layout on real life posts.

    okaaay
    so I have saved sunset2.jpg to the directory wp-images
    and I have modified the wp-layout.css to show:
    #header {
    background: #F9D9BB;
    background-image: url(‘http://petiteanglaise.com/web/wordpress/wp-images/sunset2.jpg’);
    background-repeat: no-repeat;
    and nothing happens. Only the colour change. I also tried many other permutations and am very puzzled.

    Take the /web/ out so it reads
    http://petiteanglaise.com/wordpress/wp-images/sunset2.jpg
    That should do it.

    Your header image then becomes hidden… this adjustment in #masthead brings it out:
    padding: 26px 10px 80px 60px;
    The image is also only 700px wide, whereas Gemini is 772 so you will need to drop some numbers if you wanted it to fit:
    #rap {
    width: 772px; <——-make that 702
    #content {
    float: left;
    width: 591px;
    }
    #menu {
    float: right;
    width: 175px;
    }
    Then reduce those numbers by a total of 70px.
    If you reduce margin you will need to use a smaller bg1.gif
    If you get stuck, yell 🙂

    *blushes*
    yep

    Oops 🙂
    I got that wrong !

    No podz that was fine and thanks. Just a tweak on my part. 🙂

Viewing 7 replies - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.