Mobile Drawer menu doesn't open - Broadcast theme

Topic summary

A user reports that the mobile drawer menu is not functioning on their Shopify store using the Broadcast theme.

Root Causes Identified:

  1. Modified HTML Structure - The header section’s HTML has been altered, replacing the standard <header-component> tag with a <div>, preventing theme JavaScript from initializing the mobile menu properly.

  2. CSS Conflicts - The Giraffly Trust Badges app is overriding theme styles that control drawer displays, also breaking the cart popup functionality (screen darkens but no drawer appears).

Proposed Solutions:

  • Contact Broadcast theme support for assistance
  • Restore the original header HTML structure to match the demo store
  • Address the app’s CSS conflicts by contacting Giraffly support
  • One respondent provided JavaScript code to insert in theme.liquid above the closing body tag

Status: The issue remains unresolved, requiring theme code corrections and potential app compatibility fixes.

Summarized with AI on October 27. AI used: claude-sonnet-4-5-20250929.

You have 2 problems:

  1. Your header section HTML structure is modified:

Yours:

From the demo store, same theme version:

See how you theme has div, while demo store has header-component? Because of this, some theme Javascript does not work and your mobile menu is not initialized.

  1. Even with this fixed, you have some CSS added by the Giraffly Trust badges app (https://apps.shopify.com/trust-badge-by-giraffly) which overrides some styles used by your theme code to show drawers for menu and cart. Have you noticed that when you add to cart, the screen gets darker but no popup is shown, while it should look like this:

Someone needs to have a look at your theme header, also worth contacting the App support and complain about incompatibility.