header-menu-mobile-desktop

How to set two different actions for mobile header and desktop header ( you can see the screenshots). In the desktop version, I would like that the header will’ be overlay while in the mobile version I would like there’ll be a white solid bar.

Thanks,
Vincenzo

PS: I was very happy with your support and your theme. I purchased another license for another job

screenshot_

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshot you attached. To make the header transparent you need to make the header color transparent from WoodMart >> Header Builder >> Edit Header >> Edit Row >> Color.

Screenshot for Clarification: https://ibb.co/q0Sbbzc

And you can hide it for mobile so as not to appear on mobile.

Screenshot for Clarification: https://ibb.co/xYZyVMX

Best Regards.

ok, but I want the settings to be active simultaneously.

When I see Desktop Versio I have an overlay menu and when I see mobile version I have a White solid bar

Thanks

Hello,

To use the same header scheme for the desktop and mobile you need to Go to WoodMart >> Header Builder >> Edit Header >> Mobile icon on the top right.

Screenshot for Clarification: https://ibb.co/hRgDg1b

You need to use the same settings you used for the desktop menu.

Best Regards.

See you screenshot, please

Attachments:

You must be logged in to view attached files.

I hope I explained.

Attachments:

You must be logged in to view attached files.

“To use the same header scheme for the desktop and mobile you need to Go to WoodMart >> Header Builder >> Edit Header >> Mobile icon on the top right.”

I WANT TWO DIFFERENT SCHEME FOR DESKTOP AND MOBILE

Mobile : SOLID BAR
Desktop : overlay header ( transparent )

THANK YOU

Hello,

I saw the screenshot you attached. Unfortunately, you could not use two different schemes for both desktop and mobile, the main header overlap works for both headers.

You need to set the desktop header as a transparent background. Then you need to add the following Custom CSS in the Custom CSS for Mobile Area under Theme Settings >> Custom CSS. To make it white background on mobile.

.whb-general-header{
background: white;
}
.site-content {
top: 120px;
}

Best Regards.

ok, but in this way too sticky menu became transparent.

Can you help me, thanks

Hello,

I have visited your website and the sticky header is not transparent. Please disable server caching, deactivate cache plugin, clear browser cache and check back.

Screenshot for Clarification: https://ibb.co/gF1k0Vm

Best Regards.

My website is https://phofirenze.com/

I have a new license.

thanks,

Hello,

I have changed the color of the sticky header on your website. Please clear the cache and check back.

Screenshot for Clarification: https://ibb.co/nRZcry1

I have added the following Custom CSS in the Custom CSS for desktop area under Theme Settings >> Custom CSS.

body .whb-sticked .whb-general-header {
background-color: white;
}

You can change the color accordingly.

Best Regards.

Great ! Thank you very much!

I’m happy for your support!

Most Welcome!!!..

Well, vindesign_it!.., it’s been great chatting with you! I hope I resolved your issues thoroughly.

Let us know if there’s anything else we can do for you! You can always reach us at any time. We are always here to help you.

Have a wonderful day.

Topic Closed.
Best Regards.

[Author]

Posts