Hiding the shopify chat icon behind menu's

Hi there! Im running an early version of the Dawn theme, and i just installed the shopify inbox chat app the other day. Im loving the app itself, but I have a problem with the chat icon covering up buttons in menu’s both on PC and mobile and covering parts of my cookie conscent pop op on mobile. Is there any way to code it, so it hides behind menu’s? Like make it so menu’s are always on a layer above it or something like that. my URL is: https://teefiti.dk/ The code is Teefiti2022.

Hello @MetteT

I would like to give you some recommendations to support you. Glad to support you today.
You can check out my suggestion below to get your concern resolved.

You can follow these steps:

  1. Go to Online Store → Theme → Edit code
  2. Open theme.liquid file
  3. Paste the code below before :

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

hi @GemPages . Unfortunately it didnt work. I tried upping the Z-index too but it did nothing. When i myself looked at my page i could see the chat icon being classed as iframe#ShopifyChat and Shopify-webshopchat and div.chat-app.chat-app-- so i tried these aswell and they changed nothing.

Hello @MetteT
So sorry about my mistake, here is my updated code


Best regards,
GemPages Support Team

Hi again @GemPages . It unfortunately still doesn’t work.

Hello @MetteT
Did you added the code to theme.liquid? Here is the result from my end

Best regards,
GemPages Support Team

@GemPages Yes i did. I havent checked if it now hides behind the main menu, it might. but it still shows on top of the filter menu, the drawer cart and the pop up that i mentioned.

Hi @MetteT

I checked the page the chat icon does not contain the effect code, maybe you added incorrect code. Please kindly double-check the theme.liquid file

Best regards,
GemPages Support Team

I had removed the code again since it didnt work. I’ve added it again now in the theme.liquid file. Can you check again?

UPDATE: @GemPages I just found out that the code works UNTIL you open the chat icon. If you have opened the chat icon once - it doesnt need to be in the same session - it is once again on top.

@GemPages As mentioned yesterday, I have realised the code works for hiding the icon behind menu’s until you open it once. As soon as you’ve opened it in that session it is now stuck infront of menu’s again. How do i avoid this?

Also when i first visit my store from an incognito window - so that i see it how first time costumers would - the chat allways shows a notification, even though there is none. I guess its to make people click on the chat icon, but i dont want to force them to do that to clear the notification. If they need help they will press it im sure. So i would love if i could avoid this “starter notification” from appearing. I still want it to show notifications if a costumer is actually using it and chatting with our costumer service. I just dont want the fake start up notification.

@KetanKumar Can you help?