WordPress.org

Ready to get started?Download WordPress

Forums

Replacing sidebar headings with images (8 posts)

  1. scarletarts
    Member
    Posted 7 years ago #

    I've searched the forums and found many other topics like mine, but the solutions that were given don't solve my problem. I think my issue is specific to my MistyLook theme.

    I am trying to replace the headings in my sidebar with images. I have done this successfully with my "Links" heading by altering the functions.php file (which mostly controls the theme's options page) but I can't figure out where the others are hiding.

    I do know that replacing the stuff between the relevent <h2> tags in sidebar.php hasn't done the trick, but I suspect it works in other themes.

    Please help!

    Scarlet Arts is my blog, if you'd like to see what I mean.

  2. billh
    Member
    Posted 7 years ago #

    When you say you want to replace the headings with images, do you mean completely replace each heading with a unique image or do you mean to preceed or trail the heading with an image or do you mean to have the heading text with a background image to set it off?

    The unique image one would be a bit more work. The other two are easily done with CSS.

  3. undertypo
    Member
    Posted 7 years ago #

    DO u mean by this?

    <h2 class="donate">Donate</h2>

    In CSS

    .donate { text-indent=-9999em; background:url(image location) no-repeat left;

    Is it something like this?

  4. billh
    Member
    Posted 7 years ago #

    Yes, something like that would insert the same image with each of your sidebar headers with the class "donate". Of course, I don't think you want to indent the class -9999em :)

    One that I've used before in the CSS for a theme is:

    #sidebar h2 {
    font: italic bold 16px Trebuchet, Arial, Helvetica, sans-serif;
    margin: 8px 0px 3px 0px;
    padding: 15px 0px 0px 0px;
    height: 35px;
    text-align: center;
    color: #FFFFFF;
    background: #DAA520 url(images/sidebardiv.png) no-repeat center;
    }

  5. delite
    Member
    Posted 7 years ago #

    If you are just wanting to change the "look" of your headings just take out the title and replace with an image

    ex:

    from this:<li id="linkcat-2"><h2>Blogs I read</h2>

    to this: <li id="linkcat-2"><h2><img src="linktoyourheaderimage"></h2>

    If you are correctly linking the images I don't understand why they wouldn't work

  6. undertypo
    Member
    Posted 7 years ago #

    I am using text indent for bot purpose. With text indent, the bot will still managed to saw the word and recognized it.

  7. mkalev
    Member
    Posted 7 years ago #

    I have search forums googled followed threads and still cannot figure out how to put images (that are links) in the sidebar in place of text links.
    Please help ???
    Thanks in advance!

  8. undertypo
    Member
    Posted 7 years ago #

    You mean this?


    <a href="referral site url"><img src="image url" alt="image name" /></a>

Topic Closed

This topic has been closed to new replies.

About this Topic