How to Add Custom CSS to Your Cookie Consent Banner?

Last updated on November 10, 2020

In addition to the standard customization features provided by CookieYes, it also enables you to add further customization to your cookie consent banner with its custom CSS feature.

Our setup guide will help you throughout the process of setting up a cookie consent banner for your website.

Note
Ensure you have upgraded your CookieYes account to a Premium plan (either Basic or Pro) to take advantage of the custom CSS feature.

Adding custom CSS

By adding custom CSS in CookieYes, you could transform the default appearance and behavior of your website’s cookie consent banner. This will make your cookie banner match with the overall outlook of your website.

Here’s how to add custom CSS in CookieYes:
Step 1: Sign in to your CookieYes account; or sign up for free here.

Step 2: Go to Consent Banner in the left panel > Click Content and Color to expand the menu.

Step 3: Select the CSS tab > Enter the custom CSS inside the code box as shown below > Click Save Changes to save your settings.
CookieYes custom css

To view the customized consent banner on your website, make sure you’ve copied the CookieYes script and pasted it between the <head> and </head> tags of your website’s source code — check out our setup guide for detailed help.

Now, reload your website to see the changes you have made.

Cookie consent banner set by CookieYes — before changing the font type and size

Cookie consent banner set by CookieYes — before adding custom CSS

CookieYes cookie banner after adding custom CSS

Cookie consent banner set by CookieYes — after changing the font type and size
of the banner content using custom CSS

If you have any doubts or queries regarding CookieYes, feel free to contact our support team.

just a background image

We Will Gladly Help You

If you have any issues or queries regarding CookieYes implementation,
feel free to contact our support team.

just a background image