Hello @dswebnew,
Thank you for reaching out.
To make the parent link open on mobile as well, go to: Customizer > Header > Mobile Menu > Mobile Menu Options, then set the Dropdown Target option to icon.
This way, the submenu will only open by clicking the icons, and clicking on the link text will open the link itself: https://postimg.cc/5jry4NMz.
To set the current link styles on desktop, go to: Customizer > Header > Menu: https://postimg.cc/CzZZkn4m.
Please note that if you have any custom CSS affecting the menus, you will need to disable it so that the styles from the Customizer settings are applied.
Hope it helps,
Best Regards
clicking the icons work now correct, but I cant find current link styles for mobile links
you added screen for desktop, where same settings for mobile?
Hello @dswebnew,
Thank you for getting back.
You can put the CSS below in Customizing > Custom CSS/JS > CSS Code:
#mobile-dropdown ul li.current-menu-item a {
color: #15b41f !important;
}
Please read this link for more information about the CSS/JS code on the customizer: https://docs.oceanwp.org/article/354-add-custom-css-and-js-to-your-website.
Note: If you have any cache plugin or server cache(CDN / Browser Cache and Cookies and …), you need to clear its cache contents or disable them to see your changes. Also, remember to click on the regenerate all assets file and data in Elementor > Tools(if you have Elementor).
I hope that helps.
Best Regards
I know that this can be added, but logically there should be settings common for both desktop and mobile if they are not available in mobile since the code contains current-menu-item
сorrect?
Hi @dswebnew,
I understand your point in this topic, but currently, there is no built in option for styling the active/current link specifically for the mobile menu. All available customization settings are located under Customizer > Header > Mobile Menu.
From a technical standpoint, while the current-menu-item class is indeed a standard WordPress class, the mobile menu and desktop menu in OceanWP use different HTML structures and CSS selectors to ensure better responsiveness and performance. Since they are treated as two distinct components, the desktop styling doesn’t automatically apply to the mobile view (you can find it with using inspect elements).
Even if an option were to be added in the Customizer, it would ultimately generate the same CSS. Therefore, using the CSS snippet provided in my previous reply is currently the most efficient way to achieve this result
I hope that helps.
Best Regards