change header background image for mobile

  • Resolved schlaupi

    (@schlaupi)


    3 years, 8 months ago

    Hello,
    I want to insert a different header image in the mobile version. I’ve already tried additional css, but failed. Would be very grateful for help

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Theme Author Anders Norén

    (@anlino)

    3 years, 8 months ago

    Hi @schlaupi,

    Go to Appearance → Customize → Additional CSS (the menu labels might be different in your language) and add the code below:

    @media ( max-width: 700px ) {
.header.section { background-image: url( https://www.susa-buente.de/wp-content/uploads/2022/07/cropped-cropped-Header7.jpg ); }
}

    Replace the URL with the URL of the image you want shown on mobile devices. Let me know if that does it.

    — Anders

    Thread Starter schlaupi

    (@schlaupi)

    3 years, 8 months ago

    Hi Anders,
    thank you for your prompt reply!
    I already tried that, unfortunately it doesn’t work.
    https://www.susa-buente.de/wp-content/uploads/2022/10/Portrait-Handyversion.jpg
    What now?
    thanks for helping
    –Gudrun

    Theme Author Anders Norén

    (@anlino)

    3 years, 8 months ago

    Hi @schlaupi,

    A small amendment was needed:

    @media ( max-width: 700px ) {
.header.section { background-image: url( https://www.susa-buente.de/wp-content/uploads/2022/07/cropped-cropped-Header7.jpg ) !important; }
}

    Note the !important added to the end.

    — Anders

    Thread Starter schlaupi

    (@schlaupi)

    3 years, 8 months ago

    Dear Anders,
    Thanks for the help, everything works now!
    I am really grateful and very excited about your quick help. I love your theme even more now!!!
    – Gudrun

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘change header background image for mobile’ is closed to new replies.