top of page
Writer's pictureVishal Lakhani

How Setup and Customize a Cookie Banner without Writing a Single Line of Code

Updated: May 10, 2023


Cookie consent has become a must for all companies who want to comply with international data privacy laws. Building long-term customer loyalty and data privacy compliance will be the icing on the cake.


Adzapier provides a holistic cookie consent management platform that helps you to streamline all your cookie consent needs in a centralized space. Also, it is fully compliant with Global data privacy laws like the EU's GDPR, US's CCPA/CPRA & VCDPA, Brazil's LGPD, and others. Let's learn how to integrate this platform with your website/mobile app without a single line of code.


The Process: How to Set up the Cookie Consent Banner


Before setting up anything, it's usually a good idea to audit your website/mobile app's current cookie usage and the categories of cookies your website uses the most. This will help you to know the kind of cookies your business uses more, that is, first party or third-party cookies, or are they advertising or analytical cookies?


Another reason cookie scanning is essential is that, per GDPR, it is mandatory to inform the user about the types of cookies that your website/mobile apps use to track consumer data.


So, to scan cookies from the Adzapier portal, you first need to create an account and get a cookie consent subscription. If you don't already have one, create an account and sign in.


After successfully scanning for cookies from the domain or adding cookies manually to the domain, you'll need to configure the cookie banner to be displayed on your website/mobile app.


So, you can configure your cookie banner based on three significant regulations.

  1. California's Consumer Privacy Act (CCPA)

  2. General Data Protection Regulation (GDPR)

  3. Global - Applicable to the rest of the world

Step 1: Add Adzapier to your website

While most of your work will be done in the Adzapier web portal, it's always better to first add Adzapier to your website so that you can easily display your customized cookie consent banner once you publish it.


After creating an Adzapier account, you'll need to add Adzpaier's code snippet to your website. For WordPress users, we have the most straightforward way for you to add the snippet via the official Adzapier plugin. It will automatically integrate with your website. For other sites, the code must be added manually before the closing </body> tag on your website.


Adzapier gets integrated with the best of the CMS platforms in the market, such as:

Step 2: Configuring the Cookie banner

Setting up your cookie consent banner needs detailed attention. When done correctly, it sets a course of action to make your cookie compliance effective and efficient. So, let's begin.

  • Go to the menu in property selection and select desired property.

  • Then click on the cookie consent menu and click configure banner.

After this, the banner configuration page appears. Three Regulations are enabled by default on the website: CCPA, GPDR, and Global. If you don't want any regulation, then clear the respective checkbox.


Multiple Device Live Preview

You can preview cookie notices and privacy settings pop-ups of each type while configuring the banner.


CCPA Banner Configuration

Specific things to configure for the CCPA cookie banner.


1. Select the CCPA check box under Enable Regulations on the banner configuration page.

2. Select your target area under CCPA, i.e., select California or USA.

3. CCPA Target means the users from the selected region will get the CCPA banner while the rest will get the default banner.

4. If you want a CCPA banner displayed on your website worldwide, select CCPA Everywhere.


GDPR Banner Configuration

Specific things to configure for the CCPA cookie banner.


1.Select the GDPR check box under Enable Regulations.

2. GDPR's Target list includes 27 European Union countries by default. Clear the check box of the country you want to remove from the list.

3. GDPR Target means the users from the selected region will get the GDPR banner while the rest will get the default banner.

4. To enable IAB and Google vendors, toggle on Enable IAB and Google Vendors, respectively.

5. To display only the GDPR banner worldwide on your website, select GDPR Everywhere.


Global Banner Configuration

To configure a global banner, under Enable Regulations, click the Global check box.

If you want to display only the Global banner, select Global Everywhere.


Types of Cookie Banner

We provide two types of cookie banners:

1) Header/footer banners and;

2) Box banners with various positions.

Choose the banner that fits with your website's design and brand's layout.

Select any banner type under the banner type


Advanced Features:

Customize the banner using the advanced features once Regulation Configuration is done.


Default Regulation

Select a regulation you want to display when users from the targeted area visit your website.


Cookie Blocking

To enable cookie blocking, toggle on Cookie Blocking and select Manual or Auto. To learn about this feature, see Cookie Blocking.


Step 3: Customizing the Cookie banner

Usually, Adzapier's CMP comes with a Light theme and a Dark theme. However, if you want to match your consent banner's colors with the website's design and layout, you can use the Custom Theme setting. Adzapier allows you to set the colors for:

  • Background

  • Button

  • Regular text

  • Button text


Branding

Upload your logo by clicking on choose file under Branding. The logo image in JPG, JPEG, PNG, and SVG can be supported.

The logo preview appears below. If you want to remove the logo, click Remove below the preview.


Custom CSS

We provide flexible customization by giving the option to add CSS code to your banner to improve its aesthetic appeal. CSS code will change the banner's structure, color, and text.


Manage Languages

As your visitors might be from a different place, especially the EU, you can display the cookie consent banner in various languages like English, Chinese, French, German, and so on.


Note: The banner is displayed on your domain in the default language. The user can change the banner language with Privacy Setting.


Banner Buttons

You can edit each button title of every regulation banner.


Step 4: Add your content

As you've got the style and design of your cookie consent banner all set, it's the best time to adjust the cookie consent message to your visitors. A generic text is given by default, but you can edit it at your discretion. Plus, you must add a link to your cookie policy. You can edit the content by clicking on the content tab and clicking Cookie Notice under the banner.


There's no compulsion for the exact words you use – but again, the main goal here is to get "clear, informed consent, " which is mandatory in GDPR. So, here is an alternative copy you might want to use:

  • Title — This website uses cookies

  • Description — By continuing to use our site, you understand that we use cookies to improve your experience and collect analytics data. Learn more in our Privacy Policy.

  • Button text — I agree


Step 5: Control when your cookie banner frequency

You don't want to irritate your user with a cookie consent banner popping up as they go through your website. You want to ensure that your cookie consent banner doesn't repeatedly appear after a visitor clicks the "I agree" button.

If you want to define the frequency of displaying the banner,


1. Enable Display Frequency.

2. Hover over to see the description of each setting.

3. To change the frequency of displaying the cookie banner, enter a value or click ∧ or ∨ to change the value.

4. Select any span Hour, Day, or Page View. Page View means the cookie banner displays after a specific number of visiting the domain.


Step 6: Activate your cookie consent banner

Now, you're done! All you need to do to make your cookie consent notice live is click the Save & Close button in the upper right corner to finish configuring the banner.


1.To save the progress of your configuration, click Save.

2. Once you have completed all the configurations, click Publish to implement the banner on your website. A Production CDN script pop-up will appear.

3. Conversely, you can proceed to the Implementation page by clicking the Implementation button or the Implementation option in the cookie consent menu.

4. Click Copy Script; the script is copied to the clipboard. Now you can add this JS code to your website code to publish the banner. Note: On the webpage of your domain where you want to implement the Cookie Banner, you must insert the CDN script before the closing tag.


Getting Cookie Compliance in Minutes with Adzapier

Keeping your website in the good books of the cookie consent law should be your number one priority. Use Adzpaier and set up your customizable cookie consent banner without writing a single line of code. Try free for 14 days now.

Recent Posts

See All
bottom of page