Need help? Check out our Support site, then


lost custom banner when CSS edited. NEED HELP!!!!!

  1. I copy and pasted the CSS (which I later learned I wasn't supposed to do). Now I can't view the custom banner I added to the blog. I've tried reloaded it and it still won't show up. Obviously there is something that is wrong with the CSS where the link is broken for the custom banner.

    Please help. How do I get the CSS to recognize my uploaded banner?

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

  2. You will have to use the regular image uploader and then copy the URL of the uploaded header and put it in the right place in your CSS.

  3. how do I do that?

  4. i have the same problem and am following you very closely... plenty of people tell us what to do but nobody seems to tell us how to do it! maybe its just that easy? :/

  5. Hi folks... here's a brief elaboration.

    First, the CSS editing features give you a choice whether to "add" your CSS to the existing CSS or to substitute your CSS instead of the original. If you choose the latter, you may well first copy the original CSS and use that as the basis for your modification. So copying and pasting the original CSS is not wrong, it just is not the tidiest way to proceed if you just want to make a few mods.

    Second, the reason that the banner is "lost" is that the original CSS specifies where to fetch the image from using a path that is relative to the original CSS file location. With the editing option, the CSS file is going to be in a different directory, and thus fails to refer to the correct path for the image. So to overcome that, just upload an image and then use the path to that image in the CSS.

    So, next, you need to know how to upload an image: Dashboard > Media > Add New is one way.

    That done, you need to know the path to that image, which is not necessarily obvious. One way is to go to the list of media items (Media > Library), and for the image of interest, and then select the View link. (You have to hover the mouse near the item to get the View link to appear). That will show a page with just the one image in place, and you can view the source or look in the browser status bar to see the path. It will be something like:
    http://yoursite.files.wordpress.com/2009/01/imagename.jpg ... where 2009/01 is the month you uploaded it.

    Now, how to put this into your CSS? Essentially you want to duplicate the CSS that was originally showing the image, and substitute in your new path.

    If you are using the Add CSS option, then:

    #header {
    background:url('http://yoursite.files.wordpress.com/2009/01/imagename.jpg') no-repeat left top;
    }

    (If you are using the replace CSS option, then edit only the background attribute.)

    Hope that helps.

  6. Thank you so much, this information also helped me with my problem.

  7. peterrichtarik
    Member

    gvideman: great! This helped!

Topic Closed

This topic has been closed to new replies.

About this Topic