Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • October 4, 2023 at 6:44 pm #1421422
    willymagee

    I can’t seem to find this info in documentation for the Enfold theme or in the Theme Options:
    How to I set up a transparent header for mobile device, and then insert the logo for transparent header on mobile device?
    -Willy

    October 5, 2023 at 5:09 am #1421444
    Ismael

    Hey willymagee,

    Thank you for the inquiry.

    The transparent header is disabled on mobile devices by default, and there is no built-in option to reactivate it. You can however adjust the style of the header on smaller screens using css. In the Enfold > General Styling > Quick CSS field, please add this code.

    @media only screen and (max-width: 989px) {

  /* Add your Mobile Styles here */
  .responsive #top .av_header_transparency #header_main {
    border-top: 0;
  }

  .responsive #top #wrap_all .av_header_transparency {
    position: absolute;
    background-color: transparent;
    border-color: transparent;
    border: 0;
  }
}

    You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings afterward.

    Best regards,
    Ismael

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