How to Customize Cookie Consent Banners in WordPress

BY admin IN Education, Tutorials, Uncategorized, 30.06.2026

The cookie banner usually appears immediately as soon as visitors enter your web page. Still, the vast majority of website owners ignore the possibility to make a good first impression on the visitors and just add cookie consent banner to the page as a generic grey box placed at the bottom of the page despite the whole design of the site. This is the wrong approach because cookie banner is used not only for collecting visitors’ consent but also ensuring your compliance with the GDPR, CCPA, and LGPD requirements.

Designing the banner is much more complicated than just changing its visual appearance. The structure, text, buttons location, and colors contrast play a crucial role for establishing the trust of your visitors, getting their response and making sure that the consent you obtain is valid according to law.

Why Customizing Your Cookie Banner Matters

Before touching any settings, it helps to understand what a well-customized banner actually achieves. There are three goals worth keeping in mind throughout the process:

Brand consistency. A banner that uses your colors, fonts, and tone of voice feels like part of your site rather than an intrusive pop-up. This builds trust at the most critical first touchpoint.
Genuine, valid consent. Under the GDPR, a blanket “Accept All” is not enough. “Accept” and “Reject” options must be given equal prominence, and visitors must be able to make a granular, informed choice. How you style and position these buttons directly affects whether your consent holds up.
Better user experience. Layout, position, and timing determine how disruptive the banner feels. A banner that respects the visitor’s screen and reading flow leads to clearer decisions and lower bounce rates.

With those goals in mind, let’s look at what you can actually change.

What You Can Customize on a WordPress Cookie Banner

A capable cookie consent plugin gives you control over nearly every visible element of the banner. With the WebToffee GDPR Cookie Consent plugin, the customizable elements include:

Layout style — choose between a Box, a full-width Banner, or a centered Popup.
On-screen position — the plugin offers seven placement positions, including the four screen corners for the Box layout and top or bottom for the Banner layout. (check it)
Colors — background, text, borders, and individual button colors, all set from the dashboard.
Typography — font size and styling so the banner matches your theme.
Buttons — button text, styles, and border radius for the Accept, Reject, and Settings actions.
Content — the banner title, the main consent message, and the link to your cookie policy.
The Preference Center — the panel visitors open to manage consent for each cookie category individually.

How to Customize the Cookie Consent Banner: Step by Step

This cookie consent walk-through employs the GDPR Cookie Consent plugin. This Google certified CMP plugin has integrated functionality for Google Consent Mode version 2 and IAB TCF version 2.3, and stores all the consent data in your own WordPress database. Most importantly, all of the customizations that follow can be done without any coding from within the WordPress Dashboard itself.

Step 1: Install and Activate the Plugin

From your WordPress dashboard, go to Plugins → Add New, search for “WebToffee GDPR Cookie Consent,” then click Install Now and Activate. (For the premium version, upload the plugin file you downloaded after purchase.)
Once activated, open Cookie Consent from the WordPress sidebar, then go to the Cookie Banner settings page.

Step 2: Select Your Consent Law

From within the Cookie Banner section, select the applicable Consent Law you have to adhere to, which can either be GDPR, State law, or a combination of both. Upon selection of a law, the plugin lists the regulations it supports under that particular law, and the cookie banner adjusts its consent process according to the selected law. This means an opt-in process for GDPR and opt-out for US state laws.

Step 3: Choose the Banner Layout and Position

Open the Layout tab and pick the style that best fits your design:

Box Type — a compact box you can anchor to any of four corners: Bottom Left, Bottom Right, Top Left, or Top Right.
Banner Type — a full-width bar placed at the Top or Bottom of the page.
Popup Type — a centered modal that focuses attention on the consent choice.

As a rule of thumb, a bottom Banner is the least intrusive and works for most sites, while a Popup is best when you need an unmistakable opt-in. From the same screen, you can also choose the layout for the Preference Center — the panel users open to manage their choices.

Step 4: Customize Content and Colors

Move to the Content & Colors tab. This is where the banner truly becomes yours. Here you can:

Edit the banner title and the main consent message to align with your brand voice while remaining clear and transparent.
Set the text for the Accept, Reject, and Settings buttons, and ensure Accept and Reject are equally prominent for GDPR compliance.
Adjust background, text, and button colors to match your theme’s palette, along with font size and button border radius.
Add or edit the link to your cookie policy so visitors can read the full details before making a decision. The plugin can generate this policy automatically from your cookie scan data.

Step 5: Configure the Preference Center

A compliant banner must let visitors accept or reject specific cookie categories — not just an all-or-nothing choice. The Preference Center is the panel that enables this. Run a cookie scan first (Manage Cookies → Cookie Scanner → Scan now), and the plugin will automatically detect and sort cookies into categories such as Necessary, Analytics, Performance, Advertisement, and Functional. You can then style the Preference Center to match your banner and edit each category’s description so visitors understand exactly what they are consenting to.

Step 6: Set Up Geo-Targeting (Optional but Recommended)

There are varying rules for different regions, so presenting the same banner to all the visitors is not always necessary. Using GeoIP technology, you can present the GDPR opt-in banner to visitors from EU and UK, while the visitors from relevant states in the US will see the CCPA opt-out banner and other users won’t see any banners at all.

Step 7: Preview, Save, and Test

Use the live preview to check how the banner looks across desktop, tablet, and mobile — the layouts are fully responsive.
Click Update Settings to save your changes.
Reload your site in a private/incognito window to confirm the banner appears, the buttons work, and non-essential scripts stay blocked until consent is given.

Best Practices for a Customized Cookie Banner

A few principles will keep your banner both effective and compliant:

Give Accept and Reject equal weight. Avoid styling “Accept All” as a bright button while hiding “Reject” as faint text — regulators increasingly treat this as invalid consent.
Keep the message plain. Tell visitors what cookies you use and why, in language a non-lawyer can understand.
Link to a real cookie policy. Transparency about cookie names, providers, and retention periods is one of the clearest signals of a trustworthy site.
Don’t block essential content unnecessarily. Match the layout to your audience — a subtle bottom banner is fine for most sites; reserve the full popup for cases where you truly need an explicit opt-in.
Refresh consent periodically. Consent isn’t valid forever; setting it to expire every 6–12 months keeps it current.

A Note for WooCommerce Stores: Cookie Consent Is Just One EU Obligation

Privacy consent sits alongside several other obligations — and a new one is arriving soon. From June 19, 2026, EU Directive 2023/2673 requires online stores serving EU consumers to provide an easily accessible online “withdrawal” function that lets customers cancel an eligible order within the standard 14-day window.

Just as the right cookie plugin handles consent without code, the free EU Withdrawal Button for WooCommerce adds a compliant “Request Withdrawal” button to the customer’s My Account orders page, with a two-step confirmation, partial-withdrawal support, and an admin dashboard to manage requests. If EU compliance is on your radar for the cookie banner, it is worth getting ahead of the withdrawal requirement as well.

Conclusion

Setting up your own custom cookie banner is one of the most valuable actions you can take towards compliance and user satisfaction. A customized cookie banner that aligns with your brand, offers fair choice, and adapts to your region makes your legal responsibility an implicit sign of professionalism and trustworthiness.

And here comes the best part – you will not need any help from your developer to achieve it. With such a plug-in as the GDPR Cookie Consent, everything – from every single element to layout, position, color, buttons, content, and even the preference center – is managed from the WordPress dashboard, while log records and automatic scripts blocking will make sure that your website remains fully compliant with the legislation.