Tell visitors that your WordPress website uses cookies with a notice bar

The Cookie Notice kit in TermsFeed AutoTerms shows a bar with your cookie message and a "Close" link on every page of your WordPress website. The bar informs visitors and does not hold back any script, so every script on the page runs whether or not the visitor reads the message. Setup takes 3 steps and about 10 minutes, and you need an Administrator account, or an account with a plugin role and the WordPress unfiltered_html capability.

The Cookie Notice bar above the header of a blog post, with the default message and a Close link

Use the Cookie Consent kit on a site that needs consent before it sets cookies, and the Cookie Notice kit only where a notice alone meets the rules. Article 5(3) of the ePrivacy Directive requires consent before a site stores non-essential cookies, such as analytics or advertising cookies, on the device a visitor in the EU uses. The Cookie Notice kit does not ask a question or record an answer, so it does not collect such consent.

Under their default settings, the 2 kits differ in what the visitor sees and in what happens to your scripts.

Question Cookie Notice kit Cookie Consent kit
What the visitor sees A bar with your message and a "Close" link A consent banner from TermsFeed Free Cookie Consent 4.2.0 with "I agree" and "I decline" buttons
Scripts before the visitor answers Every script on the page runs Vendor scripts outside strictly-necessary wait, and scripts outside the vendor list run
What a click leaves behind A cookie that hides the bar 3 consent cookies that the Cookie Consent script reads on every page
Where the code comes from The plugin folder on your server The Cookie Consent script, loaded from www.termsfeed.com
How visitors change their mind Nothing to change, because the bar does not ask a question The "Update cookies preferences" link reopens the Preferences Center

Turn on only 1 of the 2 kits. The plugin prints both when both are on, and visitors then see 2 messages about cookies. Set up the Cookie Consent kit with Add a Cookie Banner to WordPress.

Turn on the Cookie Notice kit with the "Enable" button on the Compliance Kits screen, because its settings screen has no "Enabled" field.

  1. Open TermsFeed > Compliance Kits in your WordPress admin.
  2. Click the "Enable" button in the Cookie Notice box. The status changes to "Enabled", and the notice "Cookie Notice enabled." appears with no "Save Changes" click.
  3. Click the "Configure" button in the same box to open the "Cookie Notice" settings screen.

The kit stays on until you click the "Disable" button in the same box. A kit that is off does not print the bar, its styles, or its script.

The kit shows a working bar with the defaults of the "Cookie Notice" settings screen. Save each change to a Cookie Notice field, style fields included, with the "Save Changes" button. Clear your page cache, and the change shows from the next page load on your WordPress website. The fields at the top of the screen set where the bar sits, who sees it, and what it says, in the order the screen shows them.

Field Values Default Effect
"Announcement bar position" "top", "bottom" "top" The edge of the page the bar sits at
"Announcement bar type" "static", "fixed" "static" Whether the bar scrolls with the page or stays at the edge of the window
"Disable for logged-in users" "yes", "no" "yes" Hides the bar from visitors who are logged in to WordPress
"Message" Rich text "We use cookies to ensure that we give you the best experience on our website" The text of the bar
"Message for close button" Text "Close" The text of the link that hides the bar, printed as plain text, so HTML in it shows as typed

The Cookie Notice settings screen with the Message editor and its Insert shortcode links marked, and the Save Changes button

The "Message" field is a small editor with the Bold, Italic, Underline, bulleted list, numbered list, Link, and Unlink buttons, and its text prints in the bar. Say which cookies your WordPress website sets and why, and link your Cookies Policy. Select the words for the link, click the Link button, and paste the address of your Cookies Policy, such as https://example.com/termsfeed/cookies-policy/.

The "Insert shortcode:" links under the editor add the site name, website URL, company name, company address, country, or state from the General Settings of the plugin. Each shortcode prints the current value of its setting on every page. The link "revert message to the default one" puts the default text back into the editor. Look up what each shortcode prints in Legal Page Shortcodes for WordPress.

On a save by a user without unfiltered_html, the plugin keeps only the HTML that WordPress allows in post content, such as links and bold text, in the message. Check which accounts have that capability in TermsFeed AutoTerms Capabilities and Roles.

A click on the "Close" link hides the bar and writes a cookie named wpautoterms-cookies-notice with the value 1, which keeps the bar hidden for that visitor. The bar shows again to a visitor who clears cookies or switches browser. A new message does not bring the bar back sooner, because the cookie does not hold a copy of the message. The cookie belongs to the site where the visitor clicked. On a WordPress multisite network, or with a site installed in a subdirectory, closing the bar on one site leaves it showing on the others.

"Announcement bar position" puts the bar at the top or the bottom of the page, and "Announcement bar type" decides whether it scrolls. A static bar is part of the page and scrolls away with it. A fixed bar stays at the edge of the browser window while the visitor scrolls, above the other elements of the page. It covers the content beneath it until the visitor closes it.

A "top" and "static" bar sits above your header and pushes the page down, and a "bottom" and "static" bar sits below your footer. A bar set to "bottom" and "static" shows only to visitors who scroll to the end of the page.

A bar at the bottom appears on cached and uncached pages. A bar at the top appears on cached pages only under a page cache that stores it with the page, such as WP Super Cache or Cache Enabler. Turn on "Caching plugins compatibility mode" on the Advanced tab of TermsFeed > Settings to show a top bar under any page cache. Choose "bottom" and "fixed", or a "top" bar with compatibility mode under a page cache, for a notice that every visitor sees.

The style fields under the message editor color the bar, its message, and its links, and set its font.

Field Values Default What it styles
"Background color" A hex color, such as #162942 Empty The background of the bar
"Font" "default", "Arial, sans-serif", "Georgia, serif", or "custom..." with any text without HTML tags "default" The font of the bar and its links
"Font size" "default", "12px", "13px", "14px", "15px", "16px", or "custom..." with any text without HTML tags, such as 1rem "default" The text size of the bar and its links
"Text color" A hex color Empty The color of the message
"Links color" A hex color Empty The color of the links in the message
"Additional CSS" CSS rules, saved only by an account with the WordPress unfiltered_html capability Empty Your own rules for the bar and its close link

Write rules for the bar and its close link in "Additional CSS" with the selectors listed under the editor. Find the class of each part of the bar in TermsFeed AutoTerms CSS Classes and Containers. Fix the field with Code or HTML Not Saving in WordPress when "Additional CSS" shows its previous rules after a save.

An empty color field and the "default" font values do not print any style, so the bar keeps the look of your WordPress theme. Find why a bar color or font you saved does not show with Colors or Fonts Not Showing in WordPress.

A working bar loads wpautoterms.js, shows your message, and stays hidden after a click on the "Close" link. Check the bar as a logged-out visitor, because "Disable for logged-in users" hides the bar from you while you are logged in.

  1. Clear your page cache. For a bar at the top under a page cache, turn on "Caching plugins compatibility mode" first.
  2. Close every private window, open a new one, load your WordPress website, then open Chrome DevTools.
  3. Select the Network tab, type wpautoterms.js in the filter box, reload the page, and check that the request returns 200. A page speed plugin that combines JavaScript serves the file inside its combined file, so no wpautoterms.js request appears, and the bar showing your message is then the check.
  4. Check that the bar shows your message at the place you chose, then click the "Close" link.
  5. Select the Application tab, open Cookies for your domain, and check that wpautoterms-cookies-notice holds the value 1.
  6. Reload the page and check that the bar stays hidden.

The bar now shows your message to every new visitor. Find the cause of a bar that does not appear or does not close in Cookie Notice Not Appearing in WordPress.