• Resolved ShyToSocialButterfly

    (@shytosocialbutterfly)


    I’d like to change the image in my sidebar on which the header title for each sidebar widget appears. I uploaded the new ‘sidebar header title’ image to the FTP and renamed it to the original ‘sidebar header title’ image name but that didn’t work.

    I also changed the name of the new image and changed the image file path in the Style CSS. That didn’t work either.

    Help please!

    http://www.ShyToSocialButterfly.com

Viewing 11 replies - 1 through 11 (of 11 total)
  • Try uploading an image called back-sidebar-title.png to your theme’s folder.

    To replace the blue image behind the titles – you need to replace this file:
    wp-content/themes/edegree/images/skin-blue/back-sidebar-title.png

    You can either upload a new version of the file

    or modify the css in this file(line 37)
    #sidebar h2, #featured-wiz h2 {background: url(back-sidebar-title.png) no-repeat }
    change the file name in the parenthesis to be the name of the new image

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    Thank you for the quick response. I changed the file name in line 37 of the CSS but it didn’t work. Any other suggestions?

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    This is what I have:

    #sidebar h2, #featured-wiz h2 {color: #fff; font-weight: bold; padding:8px 0 8px 15px; font-size: 14px; text-align: left;
    		background: url(images/back-sidebar-title-butterfly.png) no-repeat left top; overflow: hidden; margin:-5px 0 0 -5px; width:246px }

    Be sure that you working with the right stylesheet – wp-content/themes/edegree/images/skin-blue/style.css

    I don’t see that it has changed yet.

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    My mistake, thank you for pointing that out. I just changed it in the skin-blue style.css and now there’s no image there at all.

    The file name has to point to the location of the new file – it assumes it is in the same directory (skin-blue). If it is in the directory above, put “../” in front of the filename.

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    I’m sorry for being so slow to understand how to do this, I’m self taught when it comes to coding and WordPress.

    The new file is in the exact same directory as the original back-sidebar-title.png and is right above it in the skin-blue images folder list. I placed the “../” in front and the image is now the red header instead of the image I want. What did I do wrong?

    #sidebar h2, #featured-wiz h2 {background: url("../"back-sidebar-title-butterfly.png) no-repeat }

    1) remove the “../” from the url
    2) You can’t replace a 261×31 image with a 452×165 image without consequences in the layout. In this case, the transparent part of the new image is the only part that is showing.

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    Oh…I assumed that the image would automatically resize itself. Boy, did I think wrong! Let me resize it to 261×31 and try again.

    Thank you so much for your help!!!

    Thread Starter ShyToSocialButterfly

    (@shytosocialbutterfly)

    It worked! Thanks again for your help!

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Change the sidebar header image’ is closed to new replies.