You can set the z-index for the Zendesk Web Widget (Classic) using two methods: the window.zESettings object and the updateSettings API. The window.zESettings object allows you to set the z-index when the widget is first loaded. On the other hand, the updateSettings API lets you update the z-index in real-time. By default, the Web Widget (Classic) has a z-index of 999998, meaning it will appear at the front unless another element has a higher z-index.
Z-index is a CSS property that determines the stack order of overlapping elements on a webpage. When two elements overlap, the z-index value decides which element appears on top. You can assign z-index using integers or global values like inherit,…
The default z-index value for the Zendesk Web Widget (Classic) is 999998. This high value ensures that the widget appears at the front of the screen unless another element on the page has a z-index that exceeds this number. You can adjust this…
To hide the Web Widget (Classic) behind other elements, you need to set its z-index to a value lower than the elements you want it to be behind. For instance, if you want the widget to be behind a modal with a z-index of 2, you can set the widget's…
To bring the Web Widget (Classic) to the front of other elements, you need to set its z-index to a value higher than the elements you want it to be in front of. For example, if a modal has a z-index of 2, you can set the widget's z-index to 3 using…
To update the z-index of the Web Widget (Classic) in real-time, you can use the updateSettings API. This method provides flexibility to change the z-index dynamically as needed. Unlike the window.zESettings object, which sets the z-index on page…