Changing header images

Author

Posts
August 30, 2015 at 1:36 am #82480

onauduboncom
Member

I have been unable to replace the existing header image with a new image. Whenever I uploaded and select a new header image two images were shown, both smaller. I would like to change the header image monthly but have been stymied. Can you help me. Also note that I like the image big. I use a 940 x 140 image size for the header.
The site I manage is OnondagaAudubon.com
Can you outline the steps I need to take to change the header image monthly. Thanks for any help you can provide.

The blog I need help with is onondagaaudubon.com.

August 31, 2015 at 1:10 pm #82606

otjeremy
Member

Hello :)

You should be able to change the image under Appearance > Header Image (try removing your existing image first). If the duplication occurs, can you provide a screenshot?

Thanks!

September 8, 2015 at 6:35 pm #82797

onauduboncom
Member

Was not able to replace the current header. Duplication did occur. I sent screen shots from the gmail account.

September 8, 2015 at 8:11 pm #82798

otjeremy
Member

Can you let me know where you send them? (support [at] press75.com — we haven’t received any).

Thanks!

September 11, 2015 at 2:46 pm #82822

onauduboncom
Member

How do I attach screen shots to this thread? I noticed that the gmail response you sent had a “no-response” return address.

September 11, 2015 at 3:10 pm #82823

onauduboncom
Member

I sent the screen shots August 31 at 9:08 pm.

September 11, 2015 at 4:01 pm #82824

otjeremy
Member

Hi onauduboncom,

Thanks for the heads up, I’ll need to take a look as I don’t recall receiving them. Will follow up.

Thanks!

September 11, 2015 at 10:42 pm #82825

otjeremy
Member

That’s very odd. I’ve been testing on my end, and by uploading an image to Appearance > Customize > Header Image, I’m getting only one image. If I upload the same image to Appearance > Customize > Theme > Site Logo, then I see two versions of the image, but it doens’t sound like that’s what you’re doing.

It’s not possible for me to check your site’s setup, so I’ve gone ahead tagged this thread for a Happiness Engineer to look at. I believe they should be able to check your setup just to make sure that everything’s kosher on your end.

Thanks!

September 12, 2015 at 12:27 am #82826

thesacredpath
Staff

Hi @onauduboncom, I’m not seeing a custom header image on your site right now, but I did test on my test site and had no problems setting a header image, saving and then setting another one and saving. I did this 4 times just to make sure. Here is what I did.

1. From My Sites, click on Customize
2. Click on Header Image and click Add new image
3. Choose image, either uploading from my computer or picking from Media Library.
4. Choose Select and Crop, adjust crop and then click Crop Image. A few moments after that, the header image appears in the header area on the right.
5. Click Save and Publish and visit the site and verify the image is showing.

When I had a header image set already, I did the following to change it.
1. From My Sites, select Customize and then click on Header image. In that pane, it shows my current header with a Hid image and Add new image button below the image.
2. Click Add new image, upload or choose the new image from the media library. Adjust the crop and click Crop Image. After a few moments the new image shows in the preview. Click Save & Publish and visit site to make sure image is showing.

Once you have a number of images uploaded, you can click on one of your Previously uploaded images at Customize > Header Image and that image then becomes the current header. Click Save & Publish to make that live on the site.

Give the above a try and let me know how things go.

September 29, 2015 at 12:06 am #82865

onauduboncom
Member

Hi Happiness Engineer –

I likely deleted the custom header image in my fumbling around. There should be a custom header image on the site now. My issue is that I want the image to fill most of the width of the header area, approximately 960px x140px. I make the original image in the media file to those dimensions but when I move them through the Customize > Header > functions you describe above it shows up as a small size. How can I get a larger header image?

Thanks for your patience with me on this.

The site is OnondagaAudubon.com

September 29, 2015 at 1:11 pm #82866

kathrynwp
Staff

My issue is that I want the image to fill most of the width of the header area, approximately 960px x140px.

This theme is designed to display a custom header much smaller than that: 480 × 60, as you can see in the Customizer.

Screenshot: https://cloudup.com/cRCzjHzLkeU

That’s the size of custom header supported by the theme – perhaps otjeremy knows a way to make it larger, but I don’t think that can be done with custom CSS alone as it’ll make your image look blurry.

It also looks like you have a missing site logo image appearing in your header area, to the left of your current header. You should be able to fix that by adding a new site logo image under Customizer > Theme > Site Logo, and then removing it again.

Let me know how it goes.

September 29, 2015 at 2:06 pm #82867
otjeremy
Member
Thank you for clarifying.

It’s possible to add an image as a background image to the header area, but it won’t link, and it would mean hiding both the logo and header advert images. This is how it could be done (edit the image path to your desired image):
```
#branding {
   background: url("http://onondagaaudubondotcom.files.wordpress.com/2015/09/cropped-wtsp-header-e14434687195654.png") no-repeat center center;
}
```
You would then want to hide the header images:
```
.header-image,
.site-header-ad img {
    display: none;
}
```
Otherwise you’d be looking at some involved / finnicky CSS changes, to the point where I would say that showing a larger image than what the theme is setup for isn’t possible. This is something we’d need to keep in mind as customers requested it.

Thanks!
September 29, 2015 at 11:37 pm #82871

onauduboncom
Member

Thanks for the help. I have never entered the css realm but will see what happens.

September 30, 2015 at 10:57 am #82872

otjeremy
Member

You’ll need to make sure that you have the ‘WordPress Premium’ upgrade, but it should be straight forward if you copy and paste what I provided above (Appearance > Customize > Edit CSS). The most difficult part would be retrieving the image path of the image you want to use. This can be done from the ‘Media’ tab.

Thanks!

October 9, 2015 at 11:50 pm #82879

onauduboncom
Member

I got it. I think it was right under my nose all the time. I added the 960 x 140 px png image of the bird photo and logotype to Customizing > Theme > Site Logo. I removed any header images in the Header tab in Customizing first. This gives me a full width header of the logotype superimposed on the photo. Just what I was hoping for. I hope to be able to change the header image to include seasonally appropriate birds.

I appreciate all your help.
Author

Posts