A store owner is experiencing issues with header menu drop-downs where one doesn’t function at all. The working drop-down displays with a translucent dark-gray overlay, transparent border, and black text that appears unprofessional.
Troubleshooting attempts:
None of these solutions resolved the issue.
Current workaround:
The overlay color was changed to white to make text visible, but the owner seeks a proper solution to customize the drop-down menu’s background/color.
Status: A community member suggested adding custom code to the theme.liquid file after the <head> element in the Online store > Themes section, but the specific code snippet appears corrupted in the conversation. The issue remains unresolved.
I have two drop-downs in my header menu.
One of them doesn’t work.
The other has a translucent overlay (dark-gray) with a transparent border/background and black text.
Can see it on our home page here: https://seniorwellnessstore.com/
Needless to say, it looks horrible and unprofessional. I’ve found a handful of other solutions on here including adding code to the theme.liquid file (no change), adding code to the base.css file (there isn’t one), and in-line CSS (won’t publish).
Any other ideas?
UPDATE: I made the overlay color white so that you can at least see the text, but I’d prefer a good solution to changing the drop-down menu color/background, if possible.
Thx
You can try to add this code to the background menu of drop-down menu in Online store > Themes > Edit code > open theme.liquid, add this code below after element