Repairing Theme-Based Relative Links

  • Author
    Posts
  • #572777

    Greetings. I am wading into the foray of editing some of the CSS on my blog. I am using the Headlines Theme. I managed through some of the basic global changes myself, but when I try to edit something like the size and color of the widget text, I run into the problem of losing the images behind the widgets that are referenced through relative links in the theme. Example:

    .widget {
    position:relative;
    margin: 0 0 20px 0;
    background:#fefefe url(images/bg-box.png) repeat-x;
    padding:0;
    border:1px solid #fff;
    color:#555; font-family:Georgia, “Times New Roman”, Times, serif;
    line-height:20px;
    }

    When I bring that into the editor window, I lose the background image (a png of a gradient). My question is, if it is linked to the theme and not from my media library, is there a way to discern what the name/location of that image is so I can update the link or can I simply not edit that? Any direction would be greatly appreciated. Thanks!

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

    #572888

    Never mind, I found it after scouring through the source code!

    #573137

    hallluke
    Member

    If the original stylesheet specifies the image there is no need to add it in to your custom CSS declarations. Copying in the existing stylesheet should be avoided for exactly this reason. I’d suggest just adding the specific declarations you want to modify to the CSS Edit box. For example if you were only changing the widget font you would put the following single declaration rather than duplicating all the others too:

    .widget {font-family:verdana;}

The topic ‘Repairing Theme-Based Relative Links’ is closed to new replies.