HELP! Drop down menu is blank!

Technical Q&A

Topic summary

  • After switching to the “SweetThreads” theme (BlogPixie), mobile drop-down submenus (3rd level like Dangles under Earrings, and Studs) appeared blank, while desktop worked.
  • Diagnosis: the submenu was rendering white on a white background in the mobile menu drawer.
  • Fix proposals:
    • Edit theme.liquid and inject code before (steps shown in an attached image), though the exact code wasn’t visible in the thread.
    • Alternative (and safer for updates): in Customizer (Shopify theme editor) > Theme settings > Custom CSS, add: [open] > .menu-drawer__submenu { background-color: rgba(var(–color-base-accent-2), 1); }
  • Note: Other menus (Keyrings, Where to find us) were unaffected; the issue occurs with 3-level menus.
  • Guidance: Avoid editing theme code directly to prevent update complications.
  • Outcome: Adding the Custom CSS fixed the mobile submenu background; the original poster confirmed it worked. Discussion resolved.
Summarized with AI on December 21. AI used: gpt-5.
1

Hi! I updated my website lately and used a new theme. My drop down menus all work perfectly on the pc/laptop but are showing as blank screens via mobile phone. How do I fix this!?

1 Like
2

Need to see your store to suggest anything (and preview password if storefront is password protected).

3

https://jl9edq9kud12ono8-68539056343.shopifypreview.com

Here’s a preview link! It’s in the “dangles” drop down under earrings that’s doing it :disappointed_face:

Thanks!

4

It’s shown in white colour on white background.

Are there settings for this in Customizer?
What theme is this?

1 Like
5

It’s not doing it for the other drop downs though. The theme is SweetThreads by BlogPixie

6

It’s only 3-level menues – studs do the same. Let me see how to fix…

1 Like
7

Keyrings and where to find us are working fine though, that’s what has me so confused. Thank you so much!

8
  • Here is the solution for you @MelindaaJanee
  • Please follow these steps:

z5686811214059_e66de1953f1db631f9134af5cdb796ad.jpg
z5686811214059_e66de1953f1db631f9134af5cdb796ad.jpg1865×854 94.6 KB

  • Then find the theme.liquid file.
  • Then add the following code at the before tag and press ‘Save’ to save it.
  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.
9

Try this – go to Customizer, select “Theme settings” in the left sidebar, then “Custom CSS” and paste this:

[open] > .menu-drawer__submenu {
  background-color:  rgba(var(--color-base-accent-2), 1);
}
1 Like
10

So add it BEFORE ? Just want to make sure I do it right!

1 Like
11

No. not

12

Like this @MelindaaJanee

13

Do not edit theme code – you will regret it later when updating to a new version.

14

Thank you SO much! You’re absolutely incredible. It worked!