This topic contains 9 replies, has 3 voices, and was last updated by  Hans (Support Admin) 6 months ago.

Responsive Header Image

  • Hi, I’ve setup my site with the Integral Theme. Only thing is that the header image is not responsive.
    It wil not resize on a mobile or tablet. Can you please help me with this.

    Thank you.

    http://www.stesti.nl

    Regards, Niki

    @nikivaneenbergen

    The reason that is appears it is not responsive is because of the padding you have set for the Welcome section.

    If you use % amount instead of PX, you will see it will behave differently on mobile devices.

    Go to Integral Options > Welcome > Section Padding.

    Select % from the drop-down.

    Hi, this is locked for the pro version?! If I buy pro, is the header completely responsive. I mean does the image resize to show completely on mobile phone?

    thanks

    Ah my apologies, I didn’t see that you were using the Lite version.

    Yes it is locked in the free version of Integral. If you upgrade it will have more settings available.

    If I buy pro, is the header completely responsive. I mean does the image resize to show completely on mobile phone?

    Hello,

    The background image for the Welcome section is already responsive.

    What is causing it to be very large in height is your padding settings.

    In the Pro version you can use percentages instead which will fix your issue.

    If I buy pro, does the image resize to show completely fully on mobile phone?

    Is there an option to try the pro version?

    The image is set to always take up 100% of the height of the Welcome section, even on mobile.

    You can change those settings in the Pro version as well to always take up 100% of the width instead.

    So yes, you can tweak it as you desire in the Pro version.

    The free version is our trial version.

    Hi Hans

    I read this interesting posts. So where exactly you need to change to play with in pro version?

    Thanks
    Lech

    Hello Lech,

    In Integral Options > Welcome section.

    See here in this screenshot https://www.dropbox.com/s/rohflowpfyzrlz4/welcome-background-settings.PNG?dl=0

    The height of the Welcome section depends on how much text you have in the title line 1, title line 2 and tagline.

    The background image (on mobile devices) will take up 100% of the height of the window.

    That is how it should be.

    If you set the background image to be 100% of the window, on small screens there will be empty space which the background image doesn’t cover.

You must be logged in to reply to this topic.