Mobile menu changes

* I want to change the mobile menu drop down icon to plus icon and spaces like I attached Screenshot.

* Please check.
Main menu, Sub menus borders and spaces.

I know how to put Sub menus images Excluding this plz check above points.

Attachments:

You must be logged in to view attached files.

Hello,

No, there is no option. The drop-down menu is opened only by clicking on the arrow.

To change the icon:

This can be implemented with Font Awesome icons:

.mobile-nav .wd-nav-opener:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f067";
}

.mobile-nav .wd-nav-opener.wd-active:after {
	content: "\f068";
	transform: none;
}

Best Regards.

I am attaching a video link. I want to add a border to the mobile menu. When the sub-menu is opened, the border should behave as shown in the video.

https://drive.google.com/file/d/1W8EA6EirrJxYooqoFdPIGPy1FHcxzo6n/view?usp=sharing

Hello,

Please share the page url i will check and give you a custom css.

Best Regards.

Sorry for the delay in reply here’s the page URL

https://test3.prestigegemsstore.com

any update?

Hello,

I have not seen any menu on your site in mobile view.
https://ibb.co/z2HyBD3

Best Regards.

check now https://test3.prestigegemsstore.com. site is working now

Hello,

Sorry to say your reference video is not working. Can you please share the video again for better understanding.

Best Regards.

Here you go.

https://drive.google.com/file/d/1W8EA6EirrJxYooqoFdPIGPy1FHcxzo6n/view?usp=sharing

Hello,

Add below Custom CSS code to Theme Settings > Custom CSS > Custom CSS for mobile:

.wd-nav-mobile>li>a, .wd-nav-mobile>li>ul li>a {
border-bottom: none;
}

.wd-nav-mobile>li>:is(.wd-sub-menu,.sub-sub-menu), .wd-nav-mobile>li>ul li>:is(.wd-sub-menu,.sub-sub-menu) {
   border-bottom: 1px solid black;
}

Best Regards.

[Author]

Posts