Support » Themes and Templates » Changing Header Image

  • Resolved johnhds

    (@johnhds)


    I am using the Connections blog and want to change the “traffic image” to one that I designed, but don’t know where to make the change. I have read the template changes but am not sure where to insert the url. I have the url of my image.

    http://www.homedesignsense.com/blog

Viewing 15 replies - 1 through 15 (of 16 total)
  • Nicki Faulk

    (@nitallica)

    Hi 🙂

    The path I see to the header image is /blog/wp-content/themes/connections/img/top.jpg

    So you can either:

    a.) Name your new image and replace the top.jpg file in that directory.

    Or:

    b.) Change the path in your style.css file in the /blog/wp-content/themes/connections/ directory.

    (Hint: look for “top.jpg” in the file and replace it there)

    johnhds

    (@johnhds)

    Well, I got it part correct. The top.jpg image is gone but mine didn’t appear. What did I do wrong? My image is:

    http//www.homedesignsense.com/blog/personalheader.jpg

    moshu

    (@moshu)

    Just try to type your own domain without TYPO in your stylesheet 🙂

    Nicki Faulk

    (@nitallica)

    D’oh! Tacky fingers strikes again! 🙂

    johnhds

    (@johnhds)

    OK did that, but the image is hardly showing. Where is the rest of it?

    vkaryl

    (@vkaryl)

    Is your image the same size as the original? If not, you’ll have to edit the css to give it new height/width dimensions.

    johnhds

    (@johnhds)

    Where do I find the orginal’s size?

    Doodlebee

    (@doodlebee)

    In your stylesheet, you have the image set, but you have the position set as only “bottom”. If you set one part of the position, you *have* to set the other. Change “no-repeat bottom” to “no-repeat left bottom”

    Of course, when you do that, the bottom of th eimage shows up. If you want the top, it should be “no repeat left top”. (It’d probably do you well to change the size of your image, as only part of it is showing up.)

    johnhds

    (@johnhds)

    Where do I find the size of the original image, so I can make mine the same height and width?

    vkaryl

    (@vkaryl)

    In the images folder, right click on the image and select properties. Sometimes just hovering over the image will show the right info, depending on browser.

    johnhds

    (@johnhds)

    OK. I’ll do a new size an let you know. The size of the original is w=787px x h=185px in case you wanted to know 🙂

    vkaryl

    (@vkaryl)

    Yep, that’s the easiest way to ease into your own header graphic; other solutions can whack the whole layout.

    johnhds

    (@johnhds)

    OK. I got it to work. It’s not exactly centered, but close. Can it be better centered?

    http://www.homedesignsense.com/blog

    yosemite

    (@yosemite)

    You should check out connections reloaded at http://ajaydsouza.com/wordpress/wpthemes/connections-reloaded/

    If nothing else, he posted a seperate header image that can be manipulated (without losing shadings/border like yours).

    Doodlebee

    (@doodlebee)

    CHange this in your stylesheet:

    #header {
    background:#fff url(http://www.homedesignsense.com/blog/bloghead.jpg) no-repeat left bottom;

    to this:

    #header {
    background:#fff url(http://www.homedesignsense.com/blog/bloghead.jpg) no-repeat 6px 10px;

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Changing Header Image’ is closed to new replies.