Shopify Chat Box is too big and overlaps the sticky menu button (Streamline Theme)

Store Design
, ,
1

Hi there!

I’m currently working on the Streamline theme and I needed to code to resize Shopify Chat Box because it was too big in a desktop view- it worked perfectly after adding the code set below:

#ShopifyChat#ShopifyChat {
  bottom: 50px !important;
  z-index: $zindexShopifyChatBubble !important;
  max-height: 100vh !important;

However, on mobile view, the Shopify Chat Box is still too big. Here’s what it looks like right now:

IESSupport_0-1687595689057.png
IESSupport_0-1687595689057.png947×2048 161 KB

Here are the things I need help with:

  1. How can I resize the chat box of the mobile view so I will see the option to exit/minimize the chat box once it has been opened?
  2. Is there a way to move the chat box higher than the sticky menu button so they won’t overlap on mobile like this? (this doesn’t happen on desktop - only on mobile view):
    IESSupport_1-1687595890655.png
    IESSupport_1-1687595890655.png475×170 20.5 KB
2

Hi @IESSupport

We’ve carefully checked your website and found your problem quite complicated. So we suggest hiring a developer.

It’s what we can help with an optimal solution. If you need help from our expert, kindly share your request with us via Shopify experts.

We will check it and give you a detailed solution. We’re looking forward to working with you.

3

This has been an issue with the theme from the beginning. Why not make the theme function properly in development before releasing it as a product to the public? We first purchased the theme a couple years back and it had the same issue. I updated the theme and went back to review it and the problem persists.