Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 7, 2025 at 3:36 am #1476576
    lara666

    Hi there,

    Is it possible to have a black logo for the header in mobile view (while keeping the desktop view with a white logo and transparent header)? Additionally, can the burger menu have a solid white background instead of being transparent, with a font color of #969696?

    Please check the private area for the link to the mobile view header.

    Thank you so much.

    • This topic was modified 1 month ago by lara666. Reason: Misunderstood menu
    February 7, 2025 at 7:18 am #1476598
    Ismael

    Hey lara666,

    Thank you for the inquiry.

    You can use this filter in the functions.php file to assign a different logo on mobile view:

    /* Use alternate logo on mobile view */
add_filter('avf_logo','av_change_logo'); 
function av_change_logo($logo) { 
	if(wp_is_mobile()) { 
	    $logo = "https://site.com/wp-content/uploads/mobile-logo.png"; 
	} 
	return $logo; 
}

    Make sure to replace the logo URL with your own.

    Best regards,
    Ismael

    February 9, 2025 at 11:33 pm #1476790
    lara666

    Hi Ismael,

    Thank you for your response.

    I added the filter, and it works on all pages except the Services page. Please see link to screen grabs.

    Additionally, is there a way to change the burger menu background to white instead of transparent?

    I really appreciate your help!

    February 10, 2025 at 1:41 am #1476792
    lara666

    Hi Ismael,

    Just a quick update—the header is now visible on the Services page. Could you help with the burger menu?

    Thanks a lot!

    February 10, 2025 at 6:59 am #1476801
    Ismael

    Hi,

    Thank you for the update.

    You can add this css code to adjust the background color of the mobile menu overlay:

    #av-burger-menu-ul {
    background: #ffffff;
}

    Best regards,
    Ismael

    February 10, 2025 at 11:09 pm #1476858
    lara666

    Hi Ismael,

    Thank you for your response. Unfortunately, it didn’t work.

    I’ve attached a screengrab showing the result after applying the CSS code.

    February 10, 2025 at 11:30 pm #1476860
    lara666

    Hi Ismael,

    I’ve tested it out and was able to fix the issue.

    Is there a way to move the menu up so it aligns with the top of the image? I’ve added an image to Dropbox showing how I’d like it to look—file name: “Burger menu w coloured background_edited aligned image.”

    Thanks a lot :)

    February 11, 2025 at 5:49 am #1476875
    Ismael

    Hi,

    You can add this css code to adjust the position of the mobile menu items:

    #top #av-burger-menu-ul {
    display: table-cell;
    vertical-align: top;
    top: -10px;
    position: relative;
}

    Let us know if you need more assistance.

    Best regards,
    Ismael

    February 12, 2025 at 12:58 am #1476917
    lara666

    Hi Ismael,

    Thank you for your response.

    Unfortunately, this didn’t resolve the issue in portrait view, though it did work in landscape view. Could you please help in getting it to function properly in portrait view?

    February 12, 2025 at 7:36 am #1476927
    Ismael

    Hi,

    Thank you for the update.

    It seems to be applied correctly on our end — both in landscape and portrait view. Would you mind providing a screenshot?

    Best regards,
    Ismael

    February 13, 2025 at 4:13 am #1477004
    lara666

    Hi Ismael,

    I appreciate your response! It seems like it took a bit of time to appear on my end, but everything is working now.

    Thanks so much!

    February 13, 2025 at 8:23 am #1477027
    Ismael

    Hi,

    Great! Glad to know that it’s working correctly now. Let us know if you have more questions.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Transparent header not showing on mobile and tablet views.’ is closed to new replies.