How can I hide the chat widget on specific pages?

Topic summary

Core Issue:
Users want to selectively hide the Shopify Inbox chat widget on specific pages where it may be distracting, while keeping it visible elsewhere.

Primary Solution (Page-Specific):
Add conditional code to theme.liquid before the closing </head> tag:

{% if page.handle == 'page-name' %}
<style>
#dummy-chat-button{display:none !important;}
</style>
{% endif %}

Replace ‘page-name’ with the target page’s handle. One user confirmed this works after adjusting the element ID.

Template-Wide Solution:
For hiding on all pages of a specific template (e.g., blog articles), insert the same CSS code at the top of the relevant template file (like article.liquid or main-article.liquid).

Alternative Approach:
Add an id attribute to the <body> tag in theme.liquid using Liquid conditionals, then target it in custom.css to hide the chat iframe.

Ongoing Challenges:

  • Multiple users report difficulty implementing the code correctly
  • Questions remain about hiding from all blog categories simultaneously versus individual pages
  • Some users request inverse functionality (showing widget on only one specific page)
  • Several participants are still seeking personalized assistance
Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.

Hello, the improvements and integrations on the Shopify inbox app have been amazing.

One key feature that would be crucial, is the availability to hide the ‘chat with us’ widget , on certain pages. Some pages really need the chat button, others, it can be very distracting

I hope i can find some help on how to solve this. Thank you

Hey @heskew

This can be done with some extra code, send me the URL and the page you want to hide the widget from

Thank you, sending now

@heskew

Go to theme.liquid and at the end of your closing head tag


add the following code

{% if page.handle == 'cg-essential' %}
  
{% endif %}

replace “cg-essential” with the handle of the page you want to hide it from.

1 Like

Hello, thanks! I actually edited the code a bit to hide
dummy-chat-button isntead of dummy chat and it worked!! Thanks so much

Can you please share the entire code?

@ErikLima Send me your link

Hi Gang - Any chance there’s a code to exclude it from anything but a product or checkout page?

Thanks in advance!

Jared

Hi - I’m trying to remove the chat option from appearing on my blogs. What would I need to edit in your example to make this work? Thanks

Hi @SidouLF and @heskew , how would I apply this code to all blogs on the website? I have several different blog categories, and I would like to turn off chat for all of them. Do I need to list them all separately or can I disable the chat button for all blogs?

Here is example code to try to disable the “oregano oil and organic skincare” category:

{% if blog.handle == 'oregano-oil-and-organic-skincare' %} #dummy-chat-button{display:none !important;} {% endif %}

It doesn’t seem to be working. Does the code belong within the tag or just after it?

Thanks for your help!

Can you help me as well please, I tried inserting the code bellow but still cant make it hide from that page.

{% if page.handle == 'sistema-de-puntuacion' %}
  
{% endif %}

My solution isn’t necessarily URL specific but rather template specific!

For example, if you would like to hide the Shopify chat widget on article pages! You’ll need to go to Themes>Edit code and then search for the “article.liquid” template in sections folder.

At the top of the section, insert the code below:


The above code should work for any template you’d like to hide the chat widget on.

If you are looking to hide the widget on a specific page, you’ll need to have slightly more developer knowledge. You’ll need to use handles!

Handles link:
https://shopify.dev/api/liquid/basics

Hope this helps (:

1 Like

Hello dear thanks for it !

On the contrary if we want to display it only in ONE page, only the homepage do you know what kind of code it is please ?

Thanks !

You should be able to remove it from all blogs by just using the {% if blog %} but I am not 100% certain on that. It seems to me that the chat is loaded after everything else. So I made a workaround you add an id= inline to your body tag in your theme.liquid file


...lots of code here

Then in your custom.css file you can add the css to remove it

#a-blog #dummy-chat-button-iframe {
display: hidden !important;
visibility: hidden !important;
}

Here is a workaround you add an id= inline to your body tag in your theme.liquid file


...lots of code here

Then in your custom.css file you can add the css to remove it

#not-home #dummy-chat-button-iframe {
display: hidden !important;
visibility: hidden !important;
}

Can you help me add the Shopify Inbox to only one page on my website? I only want the chat widget to show on https://www.projecthomediy.com/pages/firstbox50 this page.

This is the only thing I found that works. Thanks heaps! For me the section template was ‘main-article.liquid’ not ‘article.liquid’ though.

Can you do this for me? :grinning_face_with_smiling_eyes:

I am trying to hide the button from this page.

button.chat-app{
display: none !important;} does not work. Are you able to assist?