Shopify themes, liquid, logos, and UX
Hi I am using the Live Chat Widget of Brevo. Unfortunately they don't want to give me their source code for private reasons. I want to add/render my FAQ stuff by myself over their widget (when it is opened). That means my javascript file will check if their chat widget is opened (if it is rendered) and then render on top of it my FAQ stuff.
So my questions are:
- how do I check if a specific HTML Tag was rendered? in react i am using the DOM object for that (i just check at each render if the html tag of the widget was rendered. and ofc if it was un-rendered/deleted).
- how do i access the DOM object in shopifys environment?
You can use mutationObserver to run your code when an element is added to DOM or it's attributes has changed -- this way you can run code it's actually opened.
Most likely you would not be able to modify anything inside the widget because it's in an iframe.
But you should be able to show your own popup on top of their iframe so that visitors will see it first when they hit the Chat button and then can click a button to dismiss your popup and interact with actual chat.
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025