November 15, 2018 at 19:28 UTC - Views: 34 #57365
I just installed Weaver Xtreme Plus so that I can display a different header image on each page. I can get the image to display on the appropriate page but it’s displaying way too large.
So far, I’ve added the HTML to the Header Image Replacement field on the Xtreme Plus options section and included height and width in the HTML but no matter what values I use, the image size doesn’t change.
Is there anything else I need to do to make this work? Thank you.November 15, 2018 at 22:59 UTC - Views: 30 #57372
Please paste the HTML you have used here (using the preformatted paragraph style) and give us a link to the page where you put the Header image HTML replacement.
FYI, you can change the header image on any page using the Page Featured image, and selecting header image replacement in the feature image drop down list found in the Page option layout tab.November 16, 2018 at 21:13 UTC - Views: 28 #57382
Thanks for the resonse.
The HTML is:
The link is: https://jimmv.org/testkenw/about/
I did try the Page Featured image method you mentioned but it does the same thing.November 16, 2018 at 21:15 UTC - Views: 27 #57383
Rats. Here’s the HTML:November 16, 2018 at 21:25 UTC - Views: 24 #57385
Darn, sorry for the multiple submissions. Thought my second attempt would work by using the “paste as text” option. Not sure how to paste using preformatted paragraph style.November 16, 2018 at 22:00 UTC - Views: 24 #57388
0- To paste HTML, you paste it, then select it and select preformatted in the paragraph format toolbar
1- Header image HTML replacement.
Your HTML specifies to use the image at a width and height of 50, so sure it is small…
change your HTML to the one below without the width and height
<img src="https://jimmv.org/testkenw/wp-content/uploads/2018/09/20180529_154240.jpg" alt="Bus Photo" />
3- “Page Featured image method you mentioned but it does the same thing“
That makes no sense at all, so you may not have understood what I said.
INSTEAD of using HTML, you can go to your page editing page. On the right, in the Featured Image box, you click “set Featured Image”, then select your image.
Once the featured image has been selected, you go to the page option Layout tab, and in the Featured image dropdown list, you select Header Image replacement.
Note: You image has a very vertical / Portrait format, so it will make a very High banner…November 16, 2018 at 22:26 UTC - Views: 20 #57390
I tried what you suggested but there was no change in the displayed image for that page. I used 50 to see if the image size would change at all, however, it doesn’t matter what values I use, the displayed image stays the same size. This image is 780×1040.
For the Featured Image method, I tried that on a different page and image, exactly the way you described. The image for that page is only 400×300 but also displays as large as the one I’m using the Header Image Replacement HTML method. The link for that page is https://jimmv.org/testkenw/faq/
Thanks again.November 16, 2018 at 22:41 UTC - Views: 17 #57391
OK I misunderstood what you were saying.
1- If you are using HTML and want to reduce the size of the image, you need to use CSS inline with the image like below
<img src="https://jimmv.org/testkenw/wp-content/uploads/2018/09/20180529_154240.jpg" alt="Bus Photo" style="max-width:300px;height:auto;"/>
2- If you are using the featured image method and you want the image to display at its actual size, use the option in Main Options > Header > Header Image > Use actual size.November 16, 2018 at 22:56 UTC - Views: 13 #57392
Ah, thanks very much, the CSS inline helps…kinda 🙂
Is there an “easy” way to have a different header image displayed on each page and auto sized to the same size as the main header image on the home page using Header Image Replacement HTML (per page)?November 16, 2018 at 23:10 UTC - Views: 14 #57393
The easiest would be to upload all the images at the same size 🙂
I don’t think we are understanding each other though.
Your site is set to be displayed full browser width, with some content limited to 1100px.
So on your home page, your header image is displayed at full browser width. This is exactly what you had originally, so what do you mean when you say you want your other header image to be the same size?
Are you referring to the height of the image?
Because if so, then what exactly would you expect to happen. Your home page header image has a horizontal / landscape ratio with a resolution of 1032px by 326px.
If your other images are more square, what would you expect should happen to give them the same rectangular ratio. Should they be cropped (top, bottom, both)? should they be squished ?….
If you want all your header image to have the same ratio, then you should create them and upload them this way.
And if you do not want your site to be full width, change the setting in Main options > Full Width > One step layout to traditional, and read the article below on controlling full width design.November 16, 2018 at 23:19 UTC - Views: 9 #57394
Being relatively new at web design, HTML, CSS, themes, etc I was hoping for a simple magic checkbox and one that reads my mind 🙂
Thanks so much for your patience and help.
You must be logged in to reply to this topic.