[resolved] Chronicles Theme-Help Placing A Graphic In Header (6 posts)

  1. texaun
    Posted 8 years ago #

    It's been several years since I did significant web design and used to be pretty good at getting things properly placed on a webpage using tables. I just don't have the time to get good with stylesheets. That said...

    I'm using the Chronicles theme and am having difficulty placing a 640x96 graphic in the header...centered in the "brownspace" to the right of the searchbox. The graphic is located at http://texaustralian.com/wordpress/wp-content/uploads/2008/03/montage1.jpg I assume I need to place some combination of code in header.php and style.css, but haven't been able to get close in my attempts at placement.

    Any suggestions/help is much appreciated!

  2. Michael Fields
    Posted 8 years ago #

    I don't know exactly how you want it to work or exactly how you want it positioned, but the following code will get the image in there. It uses css alone to apply your image to the background of the #searchbar. Please backup your style.css before you try this out and feel free to ask more questions.

    /**************** Body *********************/
    body {background-color:#211100; font:13px Trebuchet MS;}
    #wrapper {width:950px; margin:0 auto 50px;}
    #main {background-color:#FFFFCC; padding:5px; width:940px; padding-bottom:20px;}
    /**************** Search Bar *********************/
    #searchbar {height:70px; margin-top:10px; color:#FFFFFF; background: transparent url("http://texaustralian.com/wordpress/wp-content/uploads/2008/03/montage1.jpg") right top no-repeat;}
  3. nexenator
    Posted 8 years ago #

    Hi texaun,

    Please find the "#header{..." part in your style.css and add the following line right afterwards (after the "{"):
    background: url(http://texaustralian.com/wordpress/wp-content/uploads/2008/03/montage1.jpg) no-repeat center center;

    Thats it. No need to edit the header.php

    You cuold also try http://istylr.com. There you can import your current template and alter any css in a wisiwig like editor. iStylr is absolutely free and allows you to export your theme for wordpress again.

  4. texaun
    Posted 8 years ago #

    Thanks much! I just modified to "height:100px" at #searchbar to get the whole graphic in plus the right amount of brownspace below the graphic...check it out at http://www.texaustralian.com/wordpress Looks great in IE and Firefox.

  5. Michael Fields
    Posted 8 years ago #

    I thought that the image looked a little strange at 70px tall. Guess that's what happens when you rush things:)

    Glad it all worked out for ya,

  6. texaun
    Posted 8 years ago #

    nexenator, thanks for the alternate suggestion and tip on istylr.com.

Topic Closed

This topic has been closed to new replies.

About this Topic