header images not responsive on mobile view

Hi
I am using the Wp Header Images plugin to have specific header images on individual pages - my site is https://guided-mountain-walks.com/. I notice that the header images on mobile devices are not responsive on mobile view. The image spreads across the theme meaning the other content is reduced to a small portion of the screen. Also when I use the customize editing option view on my laptop the headers are not visible. I had this problem before but it seemed to resolve itself. At the time the plugin forum advised that the plugin ‘remains responsive because it’s not with any fixed width’ and also that I should check the theme wrapper if that’s responsive Thanks for your help which would be much appreciated

I have realised that in mobile view it was still showing the normal customising header image and so if I remove that, it solves the issue of the rest of the page being condensed. I would still like however to show the new header images for each page in responsive form. Also (you might prefer me to open a new thread for this) I now see the various parallaxes on the home page are not displaying in mobile view so that all you see are the sidebar and footer images. I appreciate any thoughts you have.

Following on from above, if I click on the full site option then the full home page is visible, as well as the different header images on the various pages. Hope that helps

Hello again
Just wondering if you have any idea what I can do to resolve this. Thanks

Hey there,
Hope you’re doing well today

The issue I’m seeing here is actually the height of your image. While it’s tall enough to make a nice strip in your header on a desktop, it won’t work well on mobile because of the width-height ratio. Essentially, the only other option here would be to stretch the image height-wise and that would make the image extremely unpleasant.
Also, I’m not entirely sure how that plugin does responsiveness, so you’ll probably have to reach out to them in regards to proper dimensions etc and see what they can do to help.

All the best.

Best Regards,
Support

Thanks for that - what about the home page content where none of the parallaxes are showing on mobile view. I assume that’s got nothing to do with the plug-in. Thanks for your help again

Hi there,
Thanks for keeping in touch with us.

Parallax is not used on mobile because of the resource intensity of the effect along with the fact that not all phones are capable of properly loading the Javascript necessary.

Just to be sure, you may test it out on www.colorlib.com/shapely from your mobile device.

Please let me know if there are any other questions that I may help with. :slight_smile:

Best Regards,
Support

Hello again
I have disabled the ‘optimize your site for smartphone’ option in Jetpack, which resolves the issue of the headers and front page parallaxes not appearing on smartphone. Bizarrely, now on smartphone when you scroll down the sidebar widgets are no longer appearing. I have no idea why this should be happening and I’ve never come across this before. I’d appreciate your thoughts.
Thanks

I should have mentioned that this is happening when you view the site in desktop view on smartphone. Otherwise the widgets appear as normal.

Stranger and stranger - I have checked and the sidebar is not appearing on tablet (portrait view - either when the desktop view option is clicked or not). When I turn the tablet round to the wider screen landscape view then the sidebar widgets do become visible.

If it’s OK I’ll close this thread and start a new one focusing on the remaining issue, which might be easier. Thanks