How can I hide the chat(Shopify Inbox) icon on mobile view?

Topic summary

A user wants to hide the Shopify Inbox chat icon on mobile devices while keeping it visible on desktop.

A solution was provided using CSS media queries added to the theme.liquid file above the </body> tag, which successfully hides the icon on mobile screens.

However, the original poster clarified their actual need: they want to hide only the floating Inbox icon on mobile while preserving the Inbox functionality itself, as they plan to embed the chat feature elsewhere on their mobile site.

Status: The discussion remains open with an unanswered question about selectively hiding the floating icon while maintaining backend functionality. Another user has expressed interest in the same solution.

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

I want to hide the Shopify Inbox icon on my phone and only display it on my computer’s webpage. I hope everyone can help me take a look: Nfcinkcase.com

Hey @Nfcinkcase

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag


If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

2 Likes

Sorry to bother you again, the previous code was completely feasible, but is there a way to only hide the floating icon of the mobile Inbox without turning off the mobile Inbox function? Because I want to embed the Inbox function entrance in another place on the mobile, I want to hide the floating icon of the mobile Inbox.

I want to do the same. Has anyone found a solution yet?