place image in toolbox header

  • Unknown's avatar
    bonnyreg · Member ·

    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: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    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.

  • Unknown's avatar
    bonnyreg · Member ·

    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

  • Unknown's avatar
    thesacredpath · Member ·

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

  • The topic ‘place image in toolbox header’ is closed to new replies.