Custom CSS not displaying on storefront

Ask the Community Customization
1

I am attempting to add some custom CSS to the Cookie Consent widget, but it is not displaying. The code I am adding is:

backdrop-filter: blur(16px) saturate(180%);
-webkit-backdrop-filter: blur(16px) saturate(180%);

When I add anything to it, the resulting widget does not display it and the live page does not even have it struck out when inspecting the element.

SXTH Element Engineering

image

3

Hi @SXTH-Element-Chase, welcome to our forum!

I see that you also opened a support ticket, and my colleague Irene is already working on your request.

I’m sure she’ll get back to you with a solution shortly! :slight_smile:

5

Hi @Helga. I did, yes. Irene gave me the framework for what I wanted to accomplish. I was missing the class identifiers from the Custom CSS section.

This code worked for me to get the frosted glass effect:

.eapp-cookie-consent-widget-container.jsx-103913050 {
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
}

1 Like
6

Hi Chase, thanks a lot for the update, it’s awesome that the issue is sorted :slight_smile:

I wish you just a great experience with the widgets you chose, and we’re always here for you should any questions come up!