How do I add a header image to Paperpunch?

  • Author
  • #806963

    I’m hoping someone may be able to help me with what maybe a really stupid question.. but.. How do I add an image as a header in paperpunch rather than just having the title written across the top? Is this possible or do I need to be able to use CSS because I don’t really get how to use that?!

    My blog is

    Thank you!!

    The blog I need help with is


    even managed to make my “thank you” a link..!!

    My blog is:




    This is the introduction to the tehem >
    This is the link to the live demo site for the theme >
    As there is no header image coded into this theme you will have to purchase a custom design upgrade and do the required CSS editing to add one to it.


    thank you for putting all those links up there. I have been through them and started to get an idea of what I need to do, but I don’t know what I actually write in the CSS code to add in a header? I’ve upgraded for the custom design, but not sure what to do next..
    sorry I’m really not great at all this!!


    Upload your header image (which should be 960px wide) to your media library and then post the URL of that image here and we can help you with the code.


    Ah thank you!

    i created it on illustrator and then exported it as a jpeg do i need to move it into photoshop to make the width 960px? I just don’t want it to pixalate!


    Ok, I’ve changed the size to 960px. Here’s the URL:

    Thank you


    Give this a try and see what you think. Add it to the CSS edit window at appearance > custom design > CSS. You can delete all the informational text in that window.

    #header {
    background: url("") no-repeat scroll 0 0 transparent !important;
    height: 233px;
    padding-top: 0;
    #title a:link {
        display: block;
        height: 233px;
        text-indent: -999px;
        width: 960px;
    #title {
    height: 233px;
    margin-left: 0;
    width: 867px;
    #description {
    display: none;

    Oh my god thank you so much! Thats brilliant – you’ve saved me more hours of figuring that out!!

    Thank you again!!


    You are welcome. And if you notice, it is clickable as a link back to your home page.


    Ah brilliant! You star! Thank you!!


    You might want to add this as well to make the font on your menu bold so that it shows up better against the background.

    #navigation .menu a {
    font-weight: bold;

    Ah brill thank you. Just done it.

    I don’t suppose you know what size you should make a wallpaper image so it’s quick to load up? my dots seem to take a few seconds to load up. They are just tiled.. but not sure if i should make them a different size?


    The image is only 70k in file size, so that is very good. I wouldn’t worry about it.


    thank you for that. i’ve updated the header etc now.. quite pleased with it.

    Can i ask you one last question? I promise that will be it then!!

    How do I move the RSS widget to be in line with the “about” tab (not next to it, just dropped down further down the page) does that make sense?

    thank you !


    This will do it and I shortened the navigation width a little bit so that it would not run over the RSS icon if the menu gets a lot of items in it.

    #wrapper {
    position: relative;
    ul#follow {
    margin: 0;
    position: absolute;
    right: 15px;
    top: 255px;
    #navigation {
    width: 890px;

    ah thank you so much that’s perfect.

    Thank you for all your help on this!


    You are welcome.

The topic ‘How do I add a header image to Paperpunch?’ is closed to new replies.