Search Icon unresponsive on mobile but working on desktop - flex theme

Store Design
, ,

Topic summary

A user encountered an issue where the search icon in their Shopify store’s Flex theme works on desktop but is unresponsive on mobile devices.

Solution Provided:

  • Locate the header__search div in the header code
  • Copy the entire div
  • Paste it within the mobile header section (before mobile__header-content closes)
  • Save the changes

Outcome:
The suggested code modification successfully resolved the mobile search icon issue. The fix involves duplicating the desktop search functionality into the mobile header structure to ensure proper responsiveness across devices.

Summarized with AI on November 12. AI used: claude-sonnet-4-5-20250929.
1

Hi there,

Is anyone able to help with fixing an issue with my search icon being unresponsive on Mobile. It’s working fine on desktop but not working on mobile. I am using Flex theme.

Website is: https://www.ippnzshop.co.nz/

Thank you

2

Hello @EmilyT1 ,

Your search icon has some code-related issues on mobile devices and for that, I need to review your code.

But, I’m giving you a better solution here.

Find the “header__search” div from your header content and copy that full div.

Once you copy that then find and in mobile header put that entire div before “mobile-header__content” is closed and save it.

Once you are done it will look like this on mobile view.

Ritu25_0-1707976201485.png
Ritu25_0-1707976201485.png323×687 175 KB

Let me know if this helps you. if you are not familior with code then PM me or sent me your header.liquid file.

Thanks,

Ritu

3

Thank you so much, that worked!