How to override chatbot default z-index and CSS styles

Wants to override the default z-index and the default Continually widget CSS styles? Keep reading to learn more.

Our widget has the maximum value for the z-index, this allows it to flow over any item on your website and always be available, but sometimes you want to lower this value to allow for other objects on your website to appear over the widget.

To change the Z-index, simply add the following code after Continually's embed code or to your website custom CSS

<style>
#continually-container{
z-index:2147483!important;
}
</style>

To override any other default CSS classes, you will need to get the element's selector like class or ID, then assign any new attributes to it or change the current one by appending "!important" after the attribute's value.

To get the correct element's selector you can use the browser's inspect tools, learn more about this here : Chrome DevTools

Note: You can only override certain elements in the sidebar, the conversation inside the sidebar is loaded inside an iFrame, and this cannot be overridden due to the restriction of same-origin policy enforced by browsers for security reasons.