Shopify Inbox Icon Overlaps Cart Drawer and Product Variant Selector - Focal Theme

Topic summary

The Shopify Inbox chat icon was overlapping with the cart drawer on desktop and mobile, as well as the product variant selector on mobile devices when using the Focal theme.

Solution Provided:

  • Add custom CSS code to the theme.liquid file after the <head> element
  • The code adjusts the z-index property to control layering of the chat widget
  • Multiple users confirmed this solution resolved their overlap issues

Additional Note:

  • One user with the Impulse theme needed to adjust the z-index value to 29 (instead of the default suggested value) to prevent the sticky menu from covering the chat window
  • This required trial and error to find the optimal z-index value for their specific theme

Status: Resolved with working CSS solution that may require minor z-index adjustments depending on the theme being used.

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

Beautiful, thanks!

1 Like