The Cookie bar is blocked by other widgets I have in the store. What can I do?
If you have any other services in the store that are using widgets in the storefront, there is a high chance that they may overlap with the Cookie bar, as shown in the example below:
In such cases, the easiest way to avoid or fix this is to change the positioning of each widget on the page so they all have their own space. To reposition the cookie bar, you may refer to our guide below:
Changing the Cookie Bar layout and position
If repositioning is not an option, you would have to use the CSS code for changing the z-index of the Cookie bar in a way so it can go on top of all other widgets.
You can find this in our FAQ section:
The bar is overlapping with other widgets on my store. How to fix that?
However, from our experience, we have noticed that there are many widgets set from different apps used in the Shopify stores, that upon installation are coming with the highest possible z-index by default. In such cases, our secret weapon is again the Custom CSS section in the Consent banner tab > Design section of our app.
What you need to do is locate the selector for the widget that needs to go behind the Cookie bar. You can do that from the dev tools of the page, as shown below:
In this case, the CSS code that you need to use should look like this:
In case you need any assistance, please make sure to reach out to our support team via live chat or at support@consentmo.com
Reposition Widgets
In such cases, the easiest way to avoid or fix this is to change the positioning of each widget on the page so they all have their own space. To reposition the cookie bar, you may refer to our guide below:
Changing the Cookie Bar layout and position
Adjust z-index with CSS
If repositioning is not an option, you would have to use the CSS code for changing the z-index of the Cookie bar in a way so it can go on top of all other widgets.
You can find this in our FAQ section:
The bar is overlapping with other widgets on my store. How to fix that?
However, from our experience, we have noticed that there are many widgets set from different apps used in the Shopify stores, that upon installation are coming with the highest possible z-index by default. In such cases, our secret weapon is again the Custom CSS section in the Consent banner tab > Design section of our app.
What you need to do is locate the selector for the widget that needs to go behind the Cookie bar. You can do that from the dev tools of the page, as shown below:
In this case, the CSS code that you need to use should look like this:
#example-selector (the one for the other widget) {
z-index: 2147483646 !important;
}
div.cc-window {
z-index: 2147483647;
}
Need help?
In case you need any assistance, please make sure to reach out to our support team via live chat or at support@consentmo.com
Updated on: 11/01/2025
Thank you!