Sticky Menu

I can’t figure out how to change the background of the sticky menu at the top when scrolling down where is the option to change the colour from black to red? as well when I turn off the title page image the page content overlaps the header I want to insure it is always a red bar how to do that? is it because I have overlap selected by default I need to change to static and then change the colour in elementor? but what about the sticky menu colour when scrolling down how to change that?

Hello,

Can you please share the page URL so I can check and give you a possible CSS code?

Best Regards.

sure the the website is https://karanl2.sg-host.com/

as well I am trying to see how to achieve this from your site as well:
another sub menu that appears below the main header image like on page
https://karanl2.sg-host.com/home-insurance-home/

I want a sub menu like on page https://www.belairdirect.com/en/car-insurance.html

I have attached a video showing you what the secondary sticky menu bar looks like

Attachments:

You must be logged in to view attached files.

Hello,

Try to add the following custom css code in Theme Settings > Custom CSS to change the background.

.whb-sticked .whb-color-light:not(.whb-with-bg) {
	background-color: rgba(208, 2, 27, 1) !important;
}

To make the sticky header effect like the example site, navigate to WoodMart > Header Builder > Edit current Header > Click on the Settings button > Sticky header tab, and in the Sticky effect choose the option “Stick on Scroll”: https://ibb.co/Mxk68LTN

Best Regards,

hello regarding the sticky menu i understand how to use the controls however i want to have another menu below the man driving the car like on the page https://karanl2.sg-host.com/car-insurance/
so below where it says Looking for Car Insurance in Canada? Great deals are a click away there is white space i want to have another sub menu there and that menu should attach to the top red sticky menu as well just like the video i sent in the previous post. i can create another menu but how do i make that attach below the top red sticky menu just like the video please?

Hello,

Can you please share some screenshots or examples of what you actually want, so I can check and give you a possible solution?

Also, share the WP admin login details of your site so I can check and give you a possible solution.

Best Regards,

1) first screen shot is like my site with red bar that is fine
2) second screen shots shows the sub menu below (jump to section, coverage, buy online, discounts, digital perls, faq
3) when you scroll down more that sub menu becomes also acts like the main menu sticking below main red menu so there are are 2x sticky menus now RED BAR and WHITE BAR
4) as you hover down more the section you are on highlights

Attachments:

You must be logged in to view attached files.

Hello,

Edit your Header using the Header Builder (WoodMart > Header Builder).

Add the menu element in the bottom header and choose the menu. (Jump to Section, Coverage, Buy Online, etc.) as a menu element in the bottom row of the header.

Once added, make that row sticky > Click on the bottom row settings > Enable the “Sticky” option for that row. https://postimg.cc/LnBf4BnC

Best Regards,

is it possible if you can add any random sub menu so i can update it myself so i can see how it attaches below the red menu please? you can do this to anypage as this site is not live yet you can do it the the faq page if you want?

Hello,

I recommend you try setting it up yourself so you can get familiar with the process. You can add any test submenu to the FAQ page or any other page as needed.

If you run into any issues or have questions along the way, feel free to reach out — I’ll be happy to help you.

Best Regards,

hello ok i added the sub menu to the page:
https://karanl2.sg-host.com/faq (see link1)

The structure in that order i want is:
I want the red bar at the top (ok)
man driving car image (ok)
Sub menu (Car Insurance FAQ Home Insurance FAQ Condo Insurance Tenant Insurance FAQ) (NOT OK)

when i scroll down the sub menu is below the red bar menu which is ok but i want the location of just the submenu somewhere else

Attachments:

You must be logged in to view attached files.

i just added your mega menu widget below the image of the man driving on page https://karanl2.sg-host.com/faq and selected the new sub menu i made in your header builder called but that is not working either

Hello,

Have you made that bottom row sticky > Click on the bottom row settings > enable the “Sticky” option for that row. https://postimg.cc/LnBf4BnC ,then check how it works.

Best Regards,

Yes I tried to make it sticky did not work
Can you take a look please And let me know what can be done as well what font is being used in this chat box it is really nice

Hello,

Sorry to hear about the inconvenience. Kindly, please share your Site WP-ADMIN Login details in the Private Content field so that we can check this concern on your Site and help you out accordingly.

Best Regards,,

see attached

Hello,

Please review your site and check the header. I have enabled the “Make it sticky” option for the bottom header row, and in the heading settings > sticky header, I have disabled the “Hide when scrolling down” option, and now both rows are stick,y which scroll down.

Best Regards,

hello thank you for updating that what i actually wanted is the submenu (white bar) to be below the person driving and when you scroll down that joins below the red bar above i had sent this to you in a video showing this did you see that video?

please take a look at this video again: http://karanl2.sg-host.com/wp-content/uploads/2025/08/1.mov to see what i am talking about.

as well in the white bar (submenu) below red menu (top bar) on mobile view is it possible to have a drop down there instead of text/icon links in the white section?

Hello,

Sorry for the inconvenience.

Your video link is not working, so please edit the container under the image where the menu items are added and make it sticky from the Advanced > Xtemos Extra settings.

Set the Offset to 90 and also set a Z-index for the container so it stays above other elements while scrolling.

See screenshot for clarification: https://postimg.cc/SJf2B06q

Best Regards,

thank you so much it looks great. i made some changes to the page: https://karanl2.sg-host.com/faq can you take a look the white bar below the man is supposed to be full width but it is not going to full width for some reason can you let me know what i am doing wrong please?

as well in mobile mode i have hidden this menu but i want a drop down menu like the three images below it will also be sticky which i know how to do but i dont know how to make it like the drop down option please?

Attachments:

You must be logged in to view attached files.

Hello,

01. Navigate to Pages > Edit the page with Elementor > Edit Container where the menu items are added and in the Xtemos layout, choose the Stretch Container https://ibb.co/s1DYvJ4

02. You can use the accordion widget to display your content in a collapsible format.

Best Regards,

I tried this option it only stretches it to the right not the left it’s quite strange can you take a look at it please?

Hello,

Now check back your site and check the issue.

Best Regards,

yes as mentioned earlier it is stretching to the right it is not filling up the left and right side equally?

Hello,

Please check back your site and ensure it is in full width.

See Screenshot for clarification: https://postimg.cc/K1CncQGM

Best Regards,

where are those settings to ensure its full width? i am using your template only thank you.

well from what i just checked see image below it is full width: the man driving is taking up the full width of the screen the bar below is not? i have several pages that i need to add this secondary navigation to so if you can please let me know what to do or do it for me that would be very helpful please

Attachments:

You must be logged in to view attached files.

Hello,

I added a margin value from the Advanced tab to the container where the menu items are placed, and then the bar is displayed at full width: https://postimg.cc/K1CncQGM

Best Regards,

[Author]

Posts