How to Add a Cookie Banner to Your Website

Choose between a notice and a consent manager

A cookie notice explains how your website uses cookies and links to further information. A consent management platform, or CMP, connects a visitor’s choices to the technologies running on the site. Those are different jobs: closing a message does not, by itself, allow or prevent an advertising script from running.

Start by reviewing the services your site loads, including analytics, advertising pixels, embedded media, and apps. Identify which technologies need a choice before they run under the rules applicable to your site. A small website can still use optional trackers, while a larger one may have a carefully restricted setup; page count and business size don’t answer that question.

For example, France’s CNIL explains that consent must precede cookies that require it, with exemptions for certain uses such as strictly necessary cookies. It also requires a genuine choice and a straightforward way to withdraw consent. Don’t assume that every cookie requires a banner, or that every analytics setup qualifies for an exemption.

Getsitecontrol provides the visual notice: you can edit its content, choose a position, configure button actions, and control when it appears. The templates below do not automatically scan your cookies, block third-party scripts, or store cookie preferences by category. If you already have a CMP, customize its consent interface rather than adding a second, disconnected “Accept” banner.

Cookie banner examples for different websites

The following examples are editable Getsitecontrol templates, not screenshots of customer implementations. Choose a layout around the space available on your website, then replace the sample wording and links. The right design keeps the message readable without covering navigation, product controls, or an existing privacy interface.

1. A long floating bar for a short notice

A blog or documentation website can use a low-profile bar when the message fits into a sentence. The horizontal layout preserves most of the reading area and gives the notice a clear place near the bottom of the screen. It works best when the text is specific enough to be useful without turning the bar into a paragraph.

This template contains a short message and a close control. Add a link to your actual cookie policy before publishing; the default bar does not provide one. On mobile, check the wrapped text together with any sticky navigation or chat launcher, because several individually small elements can cover much of the screen when stacked.

2. A text-first slide-in with a policy link

A service business may need a little more room to explain its cookie use and offer further details. A corner slide-in gives the heading, message, button, and policy link their own space. That makes it easier to distinguish reading the policy from dismissing the notification, particularly when the message needs two sentences.

The sample button says “Accept.” For an informational notice, change that to “Got it” or “Close notice” and check that it performs the Close action. Replace the policy destination as well. These edits align the interface with what it actually does, instead of implying that the click changes tracking preferences.

3. An illustrated notice for a branded storefront

A store may prefer a notice that uses the same visual language as its other messages. This illustrated slide-in gives the notification a recognizable identity while keeping the explanation and policy link together. Treat the illustration as a supporting element: it should never force the useful text or dismissal control below the visible screen.

On a product page, place it away from the add-to-cart button, size selector, and sticky checkout controls. If the store needs consent for marketing technologies, use its consent system for that interaction; this notice is not a substitute. There is little benefit in making shoppers dismiss two messages about the same cookies.

4. A compact notice for a page with limited space

A compact slide-in can suit a landing page where a horizontal bar would collide with a sticky call to action. It offers a smaller text area, so make the explanation concrete and put the longer details behind a policy link. Check the result on a narrow phone rather than judging the design only on a desktop preview.

This template’s sample copy refers to agreeing by continuing to browse. Replace that wording before using it: continuing to browse should not be presented as an affirmative consent choice. For a notice, describe the actual cookie use and label the button as dismissal; for permission to use optional cookies, use the consent mechanism discussed above.

How to add a cookie banner in Getsitecontrol

Once you’ve established that an informational notice is the right fit, you can build it from one of the templates above. The design work happens in the widget editor; connecting Getsitecontrol to your website is a separate, one-time installation. If you already use Getsitecontrol widgets on the site, don’t install a second copy of the script.

1. Choose a template and rewrite the message

Open a template preview and add it to the correct website in your Getsitecontrol account. Choose the format for its layout, not its sample text: a heading such as “Cookie notice,” a brief explanation, and a descriptive policy link are a useful starting point. Edit the message so it reflects the services your site actually uses.

For a site whose cookie use has been verified as strictly necessary, an informational message could read, “We use necessary cookies to keep this website working. Read our Cookie Policy for details.” Don’t reuse that sentence if the site also loads optional advertising or analytics cookies. Our cookie message guide includes wording for different purposes and explains where consent controls are also needed.

2. Check the policy link and button actions

Set the policy link to your published policy page, then test the destination. Keep its label descriptive, such as “Cookie policy,” so visitors can understand where it leads. A placeholder URL is easy to overlook when the design already looks finished.

For a dismissal button, select the Close widget action and use a matching label. Opening the policy and closing the notice are separate interactions; don’t make someone dismiss the message just to read the details. Getsitecontrol supports different button actions, but adding or renaming a button does not automatically connect it to a cookie management service.

3. Adjust the design for desktop and mobile

Match the typeface and colors to your website, keeping the text and controls easy to distinguish from the background. Use the mobile preview to check line wrapping and the space around the policy link. If the sentence becomes an awkward stack of short lines, shorten the wording or choose a wider format rather than reducing the type to an uncomfortable size.

Choose the position in the context of the actual page. A bottom-right notice can collide with chat; a bottom bar can cover a mobile purchase button. Preview representative pages with their other fixed elements visible, and move the notice or adjust its dimensions until all essential controls remain usable.

4. Set when the notice appears and stops appearing

In Targeting, review the pages and audience eligible to see the notice. An informational cookie message should not depend on exit intent or on someone reaching the bottom of the page. If you need it available on arrival, avoid adding a delay or scroll condition that prevents that behavior.

Then review Stop displaying widget. Use After closure when you want dismissal through the X or a Close-action button to suppress the notice. Choose the suppression period deliberately, including a permanent setting if that suits your notice, rather than assuming that a template already has the right frequency.

Upon action is a different condition: it covers actions such as opening a URL, and does not treat a Close action as engagement. Likewise, Upon view can suppress a notice after it has been seen without any acknowledgment. The targeting guide explains these distinctions; for this setup, dismissal is the event you want to test.

5. Connect the widget to your website

For WordPress, use the Getsitecontrol installation guide to connect the site through the plugin. For other websites, copy the site-specific installation snippet from Getsitecontrol and follow the general installation instructions, which place it before the closing body tag. Install it in the shared site layout if the notice needs to appear across multiple pages.

On Shopify, use the Getsitecontrol app for publishing the widget. Keep cookie consent configuration in the store’s privacy setup or connected consent service. Installing a popup app and configuring which optional technologies may run are separate tasks.

Save your widget, activate it, and open the public site to check the result. An editor preview confirms the design, but it does not prove that the installation, targeting rules, and suppression settings work together on the live page.

Test your cookie banner before publishing

Test with a fresh browser profile so previous widget interactions don’t hide the notice. Visit more than the homepage: a visitor might first arrive on a product page, an article, or a campaign landing page. Repeat the checks on a phone, where a layout that looks restrained on desktop may take up too much space.

If the website also uses a consent manager, test that system separately: check optional technologies before a choice, after acceptance, after rejection, and after changing preferences. A screenshot cannot establish whether scripts are respecting those choices. The EDPB’s cookie banner taskforce report discusses issues such as rejection controls, misleading design, and withdrawing consent.

Fix common cookie banner problems

The notice doesn’t appear

First check that the widget is active and that the installation belongs to the website you’re testing. Then use a fresh browser profile and review the targeting rules. A suppression setting from an earlier test can explain why the notice appears for someone else but not for you; an audience or page rule can explain why it appears on only some URLs.

The notice returns on every page

Check the button’s actual action and the corresponding stop condition. If the button closes the widget but suppression is configured only for Upon action, those settings do not describe the same event. Also check whether your browser is clearing site data, since persistent dismissal depends on the visitor retaining the relevant browser storage.

Two cookie messages appear at once

Look for a theme feature, consent plugin, or store privacy banner that already handles the same interaction. Decide which interface owns it and remove the redundant notification. If one message controls optional cookies and the other only closes, keep the functioning consent interface rather than asking visitors to make the same apparent choice twice.

The message looks right, but tracking still starts immediately

Review the consent implementation and the script loading order. A Getsitecontrol Close action only dismisses the widget; it does not retroactively stop a pixel that has already loaded. When prior permission is required, fix the connection between cookie choices and the optional technologies, rather than changing the notice’s colors or button label.