Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
I have installed the Shopify inbox app on my store.
Now I have a menu option in the footer menu that says "Live Chat"
I want the Shopify chat to pop open/expand when a user clicks on that link.
What URL should I add for that to happen?
Kindly let me know.
Regards
Solved! Go to the solution
This is an accepted solution.
1. Add the LiveChat link as shown below
2. Add the following code at the bottom of theme.liquid
3. Enjoy this code
<script>
if (document.readyState !== 'loading') {
watchFooterLiveChat();
} else {
document.addEventListener('DOMContentLoaded', watchFooterLiveChat);
}
function watchFooterLiveChat() {
var chatlink = document.querySelector('#shopify-section-footer a[href="#toggleChat"]')
chatlink && chatlink.addEventListener('click', toggleLiveChat, false);
}
function toggleLiveChat(e)
{
var liveChat = document.querySelector('#ShopifyChat')
if (liveChat) {
var fdoc = liveChat.contentWindow.document
if (fdoc.querySelector('.chat-app--is-open')) {
fdoc.querySelector('.chat-app--close-button').click()
} else {
fdoc.querySelector('.chat-toggle').click()
}
} else {
var iframe = document.querySelector('#dummy-chat-button-iframe')
iframe && iframe.contentWindow.document.querySelector('button').click()
}
e && e.stopPropagation();
return false;
}
</script>
This is an accepted solution.
1. Add the LiveChat link as shown below
2. Add the following code at the bottom of theme.liquid
3. Enjoy this code
<script>
if (document.readyState !== 'loading') {
watchFooterLiveChat();
} else {
document.addEventListener('DOMContentLoaded', watchFooterLiveChat);
}
function watchFooterLiveChat() {
var chatlink = document.querySelector('#shopify-section-footer a[href="#toggleChat"]')
chatlink && chatlink.addEventListener('click', toggleLiveChat, false);
}
function toggleLiveChat(e)
{
var liveChat = document.querySelector('#ShopifyChat')
if (liveChat) {
var fdoc = liveChat.contentWindow.document
if (fdoc.querySelector('.chat-app--is-open')) {
fdoc.querySelector('.chat-app--close-button').click()
} else {
fdoc.querySelector('.chat-toggle').click()
}
} else {
var iframe = document.querySelector('#dummy-chat-button-iframe')
iframe && iframe.contentWindow.document.querySelector('button').click()
}
e && e.stopPropagation();
return false;
}
</script>
Worked like a charm. Thank you.
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025