[Resolved] Header Background not working on mobile

Home Forums Support [Resolved] Header Background not working on mobile

Home Forums Support Header Background not working on mobile

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1452819
    Laurice

    I’m trying to have my header background image show up on mobile. Currently, it only shows on Desktop.

    #1452825
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can link us to the site in question?

    You can use the private information field.

    Let me know πŸ™‚

    #1452867
    Laurice

    Yeah no problem

    #1452873
    Leo
    Staff
    Customer Support

    You have the mobile header option activated so the default header is hidden on mobile:
    https://docs.generatepress.com/article/mobile-header/

    Try disabling the option first.

    That background image won’t work very well on mobile though.

    Can you try adding that as the site logo and see if works better?
    https://docs.generatepress.com/article/adding-header-logo/

    Let me know πŸ™‚

    #1452881
    Laurice

    Awesome thank you! Is there a way to have a different header image for mobile that is more mobile friendly?

    #1452885
    Leo
    Staff
    Customer Support

    Are you referring to a different logo image or background image?

    #1452892
    Laurice

    Background image

    #1452893
    Laurice

    https://www.harpersbazaar.com/

    This is what I’m looking to do

    #1452898
    Leo
    Staff
    Customer Support

    You can apply a mobile-specific background image with this CSS:

    @media (max-width: 768px) {
        .site-header {
            background-image: url(https://MOBILE_IMAGE_URL);
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1452934
    Laurice

    Thank you πŸ™‚ The Img URL isn’t working in the code


    @media
    (max-width: 768px) {
    .site-header {
    background-image: url(https://relaxingdecor.com/wp-content/uploads/2020/09/c2f1e4208a0b1acd0f7427ab54bc4ed8.jpg);
    }
    }

    #1452943
    Leo
    Staff
    Customer Support

    Looks like it’s working for me?
    https://www.screencast.com/t/Xssfjh9p3M

    #1452945
    Laurice

    Actually I got it thank you!

    #1452949
    Leo
    Staff
    Customer Support

    No problem πŸ™‚

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.