Skip to main content
Cyber Monday

Deal expires in

- Days
:
- Hours
:
- Minutes
:
- Seconds

Get up to 50% off on CookieYes!

Show popup

Getting Started

Chapter 1:

How to Add a Cookie Banner to Your Website

Welcome to CookieYes! This guide will walk you through everything you need to know about creating a cookie banner, customisations, and implementing it on your website.

Note

If you signed up on CookieYes before 15 March 2022, refer to this setup guide to implement a cookie banner on your website.

To get started with CookieYes, create your account.

After you sign up, you will be directed to a setup screen. Follow the instructions below to add a cookie banner to your website.

Step 1. Configure your cookie banner

Select a cookie banner layout from the options available: Box, Banner and Popup.

Note: Pro and Ultimate plan users will have access to the Popup template.

Configure Banner
  • You can also select the Banner Language of your cookie banner. You will be able to edit this and add multiple languages later.
  • You can choose any banner template from the default light and dark themes, and if you want to further customise it, click Customise beneath to tailor it to your specific requirements. .
  • You may choose the Auto-generated Template layout, which is auto-recommended based on your website’s colour scheme.

Pro Tip

To implement your cookie banner faster, you can simply proceed to Step 4 with the default layout that you have chosen. You can customise the cookie banner at any time later via the Dashboard > Cookie banner. You can refer to Step 2 in this guide to do the customisations.

When you click on Customise a panel will appear where you can customise the banner as per your liking. Below, find the step-by-step instructions on how to customise your cookie banner layout, content, colour and add custom CSS.

In the General tab, you can set the Consent Template. You can choose the consent template for your website: GDPR, US STATE LAWS or GDPR & US STATE LAWS. 

Note: You may choose the GDPR & US STATE LAWS Consent Template if you want to comply with both laws at the same time. This feature is available only on Pro and Ultimate plans.

  • Under the Geo-target banner, you can set your geo-targeting rules for your cookie banner.
  • For GDPR Consent Template, you can enable Support IAB TCF v2.2 (Available only on Pro and Ultimate plan) if you run ads on your website. When enabled, a banner will appear on your site, allowing visitors to set granular advertising tracking preferences.
  • You can click on Show advanced settings to see advanced options.
  • Under the Consent expiration, you can set the time after which your website’s visitors will be shown a consent banner again.
  • Enable Reload page on consent action if you want your web page to reload after the visitor accepts or rejects consent.

Note: By default, CookieYes sets 365 days as the expiration time for cookie consent. Visitors of your site who have given consent will be shown the cookie banner again after this duration.

Select Layout from the left panel to edit/change your banner type. There are currently three banner layouts available: Box, Banner, Popup.

Box 

There are four available positions: Bottom left, Bottom right, Top left, and Top right.

Box layout

Banner 

There are two available positions: Bottom and Top.

Popup – Center.

Preference Center

Box – There are 2 options available: Center and Sidebar.

Banner – The three configurations are Centre, Sidebar, and Push down.

The Categories on first layer feature is available with Banner + Push down layout only.

Popup – There are 2 options available, Center and Sidebar.

Select Content from the left panel to customise the content of the banner and all banner elements including title, banner text, button texts, and the preference centre.

  • To edit the message on your banner, select the Cookie Notice. You can edit or change the content of the Title and Message. 
  • You can enable the Close [X] button if you want the banner to have a close button.
  • You can edit the button labels that appear on your banner – “Accept All”, “Reject All” and “Customise”.
  • You can enable the “Cookie Policy” link and provide the URL to your privacy policy page or cookie policy page. You can also change the label name.
  • To personalize your banner, you can add your Custom logo (Available only on Basic, Pro, and Ultimate plan).
  • Select Disable CookieYes branding to hide the ‘Powered by CookieYes’ logo that appears on the banner. (Available only on the Ultimate plan).
  • To edit the content of the second layer of your banner, select Preference Center. Here you can edit or change the content of the Title, Privacy overview, and the text of the “Save my preferences” button.

    prefrence center
  • You can enable the Show Google Privacy Policy option, which ensures that the Google Privacy Policy is displayed on the second layer of your banner. This is necessary if you use services provided by Google, such as AdSense, Firebase and Analytics on your website, as mandated by the Digital Markets Act (DMA).
google privacy policy
  • You can also edit/change the content of the Message, Link Text and URL of the Google Privacy Policy.
Cookie List
  • To edit the content of the cookie list displayed in the second layer of your banner, select Cookie List and enable Show cookie list.
  • You can also edit headings within the list for – Cookie, Duration, and Description.
  • Select the Revisit Consent Button option to edit the settings of the consent callback button.
  • The Revisit Consent Button will enable your website users to change/withdraw consent easily.
  • You can change the position of the Floating Button, set Custom icon (Available only on the Ultimate plan) and also the Text on hover. Here’s what the button will look like.
Floating revisit cookie widget on a website
  • In the Blocked Content, you can edit the Alt Text for Blocked Content. This is the content that will be displayed over embedded videos (Youtube, Vimeo etc.) in case the website visitor has rejected certain cookies that are required for the video to play.

Select Colours on the left panel to customise the colour of the banner and all banner elements including background, buttons and text.

  • Choose from the different colour themes for the banner: Light, Dark and Auto Generate.
  • Under Customise colors, you will find options to customise the colours of the Cookie Notice, Preference Center, Revisit Consent Button, and Alt Text for Blocked Content.
  • You can customise the colour of the background, border, title, and text under each of these options.

Select Custom CSS on the left panel to add advanced CSS to personalize your banner style.

  • Enter the custom CSS code in the given box (Available only on Basic, Pro, and Ultimate plan).

You can hide categories from the banner so that it does not appear on your banner’s second layer. To enable this feature, follow the below steps:

  1. Navigate to the Cookie Manager > Cookie Category.
  2. Click the edit icon.
  3. Toggle the button (to the right) labelled “Hide category from banner”.
  4. Click the Save Draft button to save the change made.
  5. Now, click the Publish changes button.
 Hide categories from the banner

  • After you have done the required customisations, you can click on Save My Template. 
  • Click Next Step to proceed to the next part of the setup.

Step 3. Select an Installation Method

To manually install CookieYes to your website, click on the Install manually on website option.

method to install

Alternative Option

If you prefer to use Google Tag Manager, select Install with Google Tag Manager instead. For step-by-step instructions on this method, please refer to the Getting Started with Google Tag Manager and CookieYes Guide.

Step 4. Copy cookie banner code

Click on Copy Code to copy the CookieYes installation code to add it to your website.

copy code
  • Click on Copy Code to copy the CookieYes installation code to add it to your website.

Note: You can share the code with a developer or your team by clicking on Send code to Developer link. Enter the email address and then click on Send Instructions. The recipient will get the code and instructions via email.

Next Step. Install cookie banner on your website

  • Now you have to paste the CookieYes installation code on your website.
  • Select the CMS or website builders listed below to get the step-by-step instructions to add the code to your website.

Note: Don’t see your CMS in the list? 

CookieYes can work on all major CMS platforms and custom-coded sites. Add the installation code between the <head> and </head> tags of your website’s source code before any other script. Save changes,  refresh your site and check if the banner is active on your website.  If you are facing any issues, please get in touch with technical support.