Need help? Check out our Support site, then


place image in toolbox header

  1. Hello again good people at WP.
    Could someone please explain to me the CSS code that I should use to place images in the header of toolbox theme pages.
    I had a browse around the CSS forum but couldn't find a suitable answer, and one reply to the same question on a different theme stated that all themes have different CSS entries, so I'm stumped I'm afraid.
    Regards Bonny Reg

    The blog address is http://humorousscript.wordpress.com

    The blog I need help with is humorousscript.wordpress.com.

  2. Hi, not knowing exactly what your end desires are for your site, I'll offer the following to get you started and give you some ideas. I've set a width for the overall content container, which is #page on toolbox to 950px and just so you can see it, I've given it a low-opacity white color. I've also set the left and right margins of #page to "auto" so that it remains centered in the browser window and added some padding so that the content is not flush up against the margins of #page.

    I then set a height and width for #branding, which is the area a header image would typically be inserted into and again, I've given it a background low-opacity color so that you can see where it is and the size.

    #page {
    background: rgba(255, 255, 255, 0.2);
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 20px;
    padding-left: 20px;
    padding-right: 20px;
    width: 950px;
    }
    
    #branding {
    background: rgba(255, 255, 255, 0.2);
    height: 250px;
    width: 100%;
    }

    You can adjust the heights and widths as you desire and then upload an image to your media library (Media > Add New) with the dimensions of the width in #page and the height in #branding. Get the URL of that image and then replace the rgba(255, 255, 255, 0.2); in #branding with the following and replace URL OF IMAGE between the double quote marks with the URL of your uploaded header image.

    background: url("URL OF IMAGE") no-repeat scroll 0 0 transparent;

    See what you think and we can work from there.

    Also, starting from scratch with a theme design can be quite a job, and although a lot of fun, it can be a little frustrating.

    If it becomes frustrating, we can help out with some of it, but we have also partnered with Tweaky, a design consultant that can help you dive deep into the design and get it looking just like you want it.

  3. Thank you so so much for your reply, I will take my time over the next couple of days to try and muster something-up using your CSS above.

    I have another question but think I should ask on the forum as it's on a different subject.

    Kind Regards Bonny Reg

  4. Bonny, you are welcome and let us know if you have any problems.

Topic Closed

This topic has been closed to new replies.

About this Topic