Skip to content

Documentation

How to Add a Cookie Banner on an HTML Website

How to Add a Cookie Banner on an HTML Website

Last updated Mar 15, 2026

This guide covers adding the Kukie.io cookie consent banner to any plain HTML website or static site. If you are not using a CMS or framework, this is the guide for you.

Prerequisite: You need a Kukie.io account and at least one site added. If you haven't done this yet, follow Create Your Account & Add Your First Site first.

Step 1: Get Your Embed Code

Log in to your Kukie.io dashboard, navigate to your site, and copy the embed code from the Setup tab. It looks like this:

<script src="https://cdn.kukie.io/s/YOUR-SITE-KEY/c.js" async></script>

Replace YOUR-SITE-KEY with the actual site key shown in your dashboard.

Step 2: Add the Script to Your HTML

Open your HTML file(s) and add the Kukie.io embed code inside the <head> tag:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdn.kukie.io/s/YOUR-SITE-KEY/c.js" async></script>
    <title>Your Page Title</title>
</head>
<body>
    <!-- Your content -->
</body>
</html>

Every page needs the script: Unlike CMS platforms, static HTML sites require you to add the script tag to every HTML file. If you use a templating system (like includes or a static site generator), add it to the shared header template.

Static Site Generators (Jekyll, Hugo, Eleventy)

If you use a static site generator, add the script to your base layout template:

  • Jekyll: _includes/head.html or _layouts/default.html
  • Hugo: layouts/partials/head.html or layouts/_default/baseof.html
  • Eleventy (11ty): your base layout file (e.g., _includes/base.njk)

The script is a standard HTML tag — no build step or npm package needed.

Step 3: Verify the Installation

Visit your website in a new browser window (or incognito/private mode). You should see the Kukie.io consent banner appear. If it does not show, check the following:

  • Open your browser's Developer Tools (F12) and look for the script in the Network tab — it should load with a 200 status
  • Check the Console tab for any JavaScript errors
  • Make sure you published/saved your changes in your website
  • Clear any platform-level cache if applicable

For a detailed verification walkthrough, see How to Verify Your Banner Installation.

Next Steps

Need help? If you run into any issues, contact our support team and we'll help you get set up.

Previous

How to Add a Cookie Banner on a HubSpot Website
Next

How to Add a Cookie Banner on a React.js Website
Was this helpful?