Swede61 Posted October 21, 2022 Posted October 21, 2022 Hello everyone I have managed to change appearance on my site navigation when viewing in desktop mode and it works like a charm. I used the following coding: .header-nav-item:hover>a, .header-nav-folder-item:hover a { color: #fc0 !important; } .header-nav-item--active>a, .header-nav-folder-item--active>a, .header-menu-nav-item--active>a .header-menu-nav-item--active { color: #fc0 !important; } .header-nav-item--active a { background-image: none !important;; } But I can't get it to work in the hamburger menu, the links are still underlined and isn't changing color when active. I have searched the forums and tried a number of different suggestions, but none of the work. Any help would be highly appreciated.
Beyondspace Posted October 21, 2022 Posted October 21, 2022 1 hour ago, Swede61 said: Hello everyone I have managed to change appearance on my site navigation when viewing in desktop mode and it works like a charm. I used the following coding: .header-nav-item:hover>a, .header-nav-folder-item:hover a { color: #fc0 !important; } .header-nav-item--active>a, .header-nav-folder-item--active>a, .header-menu-nav-item--active>a .header-menu-nav-item--active { color: #fc0 !important; } .header-nav-item--active a { background-image: none !important;; } But I can't get it to work in the hamburger menu, the links are still underlined and isn't changing color when active. I have searched the forums and tried a number of different suggestions, but none of the work. Any help would be highly appreciated. Can you share the site URL so we can take a look? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox - PDF Lightbox popup - ...) </> 🗓️ Delivery Date Picker (Date picker form field) Gallery block 7.1 workaround </> No-code customisations for Squarespace
Swede61 Posted October 21, 2022 Author Posted October 21, 2022 Yes the site url is: http://toolex.net
Solution ghostplugins Posted October 21, 2022 Solution Posted October 21, 2022 (edited) Hey @Swede61 👋 Try this CSS! // Remove Mobile Menu Active Nav Line - Ghost // .header-menu-nav-list .header-menu-nav-item * { background-image: none !important; } Edited October 21, 2022 by ghostplugins Ghost Plugins: Boo! Over 500+ free plugins for Squarespace 👻 Pluto Studio by Ghost: No design fees, hourly rates, or deposits 🌘 White Label: Expedite your client work and boost profitability 🎉
Swede61 Posted October 22, 2022 Author Posted October 22, 2022 Perfect thank you - that did it with the underline. I then tried to get the active menu item to show a different color with the following code: .header-menu-nav-list .header-menu-nav-item--active { color: #fc0 !important; } But that didn't work 😒
tuanphan Posted October 23, 2022 Posted October 23, 2022 21 hours ago, Swede61 said: Perfect thank you - that did it with the underline. I then tried to get the active menu item to show a different color with the following code: .header-menu-nav-list .header-menu-nav-item--active { color: #fc0 !important; } But that didn't work 😒 With mobile, use this CSS div.header-menu-nav-item--active a { color: #f1f !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)
Swede61 Posted October 23, 2022 Author Posted October 23, 2022 Thanks tuanphan, it's working now 😃 tuanphan 1
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment