How To Set Up Your Squarespace Cookie Banner
Cookie banners are annoying, I know, but they are important for data privacy. They allow your users to control whether or not you to track specific information about them, and it’s always good to respect the wishes of your website visitors.
I am NOT a lawyer, so this is not legal advice, but if you have a Squarespace website, here is what I think you need to know about cookies and setting up your Squarespace cookie banner.
What are Cookies?
Cookies are small pieces of data that websites place on your device to remember information about you and recognize you when you return to the website in the future. Cookies can be “essential” or “non-essential”.
Essential cookies are used to make features like customer accounts and shopping carts work on your website. Visitors can’t decline essential cookies. If they use your website, they are consenting to you collecting those cookies.
Non-essential cookies are used for things like tracking website analytics and targeting marketing and advertising. (You know how when you visit a website you then get bombarded with ads for that same product. That’s what cookies do!)
Learn more about how Squarespace uses cookies.
What is a Cookie Banner?
A cookie banner is notification that appears on a website to inform visitors that the website uses cookies and ask for consent to use “non-essential” cookies. The banner appears the first time a visitor visits a website and once consent is provided (or declined) Squarespace won’t show it again for 30 days. (This is controlled by an “essential” cookie!)
Do You Need a Cookie Banner?
Some regions of the world have very strict privacy laws that require websites to get EXPLICIT consent before using “non-essential” cookies. Because you never know where your website visitors are located, it’s a good idea to use a cookie banner and get EXPLICIT approval before capturing “non-essential” cookies. (The word on the street is that California has been suing small businesses for not complying with its privacy laws. And everyone knows about GDPR. Better safe than sorry!)
All Squarespace websites include Squarespace Analytics which uses non-essential cookies to determine whether the same person comes back to visit your website again.
If you take no action on a new Squarespace website, the cookie banner will NOT be displayed and Squarespace WILL ALWAYS TRACK non-essential cookies. This is technically, not privacy compliant and as mentioned, could be illegal in some geographies.
If you prefer NOT to use a cookie banner, you should always restrict non-essential cookies so they are never tracked. To do this:
Go to Settings > Website > Cookies and Data Privacy
Keep the cookie banner toggled off
Click “RESTRICT COOKIES” (in red) at the very bottom of the screen.
A cookie banner is not all you need to fully comply with privacy laws, but it definitely helps!
How to Set Up Your Squarespace Cookie Banner
This is how I have my cookie banner set-up currently on my website.
Pro tip: You can open any website in an Incognito or Private tab to see what the cookie banner looks like if you have already dismissed it for 30 days.
Here are my suggestions for how to configure your Squarespace cookie banner to be user friendly and compliant.
Configure Your Cookie Banner
To configure your cookie banner, go to Settings > Website > Cookies and Data Privacy
This is where you set up which buttons to include, what the text on the banner will say, and how visitors can manage their cookie preferences (or not).
Cookie Banner – toggle this ON to show the cookie banner
Preview - this is a preview of what your banner will look like with the options you select below
Customize the Banner Style – this will take you away to the styles menu to set your color theme, position, and text size. Skip this for now and we will style it later.
Banner Text - This is where you configure which buttons and text you want to include on your cookie banner.
Accept Button Label – defaults to Accept
Manage Cookies Button – If you turn this ON, visitors can manage which cookies they want to accept right from this banner. (I turned mine on.)
Manage Button Label – defaults to Manage Cookies
Decline All Button – If you turn this button on, visitors can decline all non-essential cookies right from the banner. (I decided to NOT to include this button and just use the Manage Cookies button to keep the banner less cluttered but still give people a way to turn off cookies.)
Decline Button Label – defaults to Decline
Disclaimer Text – this is the text that displays on your cookie banner. You can keep the standard Squarespace default message or write something else. You can restore the default Squarespace message later if you change your mind. To be fully compliant, you should link to your Privacy Policy or separate Cookie Policy in this disclaimer text.
This is the text I use, feel free to copy mine and tweak it (but I am not a lawyer) and don’t forget to change the Privacy Policy link!
This website uses cookies🍪to keep things running smoothly and give you a great experience. You can accept cookies or manage your preferences below. Read my Privacy Policy for more details.
Saved Preferences – These are the settings for the button/banner that allows people to change their cookie preferences in the future.
Layout – You can choose a pill, a sub-footer, or you can hide this altogether and not allow people to change their preferences. I recommend keeping this ON! I use the pill and I made my footer a little bit bigger so it does not overlap my footer content. Check mine out in my footer.
Preferences Label – Defaults to Cookie Preferences
Advanced Privacy Settings
Activity Log – I keep this turned on so if there is an unusual spike in traffic to my website, I can see where it came from and what pages that person was looking at. (You can access the activity log in the Analytics section of your website). It is technically not privacy compliant to keep this on, but it is only kept for 7 days so it’s low risk for the privacy police. If you are worried about the privacy police, turn it off.
Non-Essential Cookies – If you have your Squarespace Cookie Banner enabled, this will say “Restricted” which means non-essential cookies will NOT be placed on visitors browsers unless the ACCEPT cookies. If your cookie banner is NOT enabled, you will have the option to RESTRICT non-essential cookies completely (meaning you never capture them) or NOT RESTRICT them, which means you always capture them because you are not asking people for consent.
2. Style Your Cookie Banner
To style your cookie banner, go to Styles > Accessories > Cookie Banner
This is where you configure the colors, position, and text size of your cookie banner.
Remember that cookies will NOT be tracked until the visitor EXPLICTLY accepts so you want the banner to be visible so they can accept (if they want to) so you get the most accurate website analytics.
Color Theme – you can select one of your standard color themes for your cookie banner (choose a theme that will stand out against your home page header)
Banner – You can select to show the banner as a box in any corner of your site or as a full banner on the top of bottom of your site. (A box on the bottom left or a banner across the bottom of the site are the most common locations for a cookie banner.)
Disclaimer Text Size: This defaults to .8rem and there is no need to change it!
The cookie banner buttons will inherit your websites button type styles which can be configured under Styles > Buttons and use the color settings in the color theme you chose above.
Accept uses the Primary Button Style
Decline uses the Secondary Button Style
Manage Cookies uses the Tertiary Button Style
** Any changes you make to button styles or color themes will apply everywhere on your site so be careful!
3. Customize Your Cookie Banner with CSS
Here are a couple of CSS customizations I like to use on my cookie banners. This code goes under Pages > Website Tools > Custom CSS.
//** Reduce the opacity of the cookie banner
.gdpr-cookie-banner {
opacity: .85;
}
//**Add a thin border around the cookie banner (change the hex code to one of your website colors)
.gdpr-cookie-banner {
outline: 1px solid #337F88;
}
The Net Net
Using the Squarespace cookie banner is a great way to provide privacy protection for your website. Your Privacy Policy is another important part of the equation so make sure you have one and you link to it from your cookie banner. You can read more about Data Privacy and Squarespace to help ensure your website is compliant.
If you are looking for a robust tool to ensure your privacy policy, website terms & conditions, and cookie solution are fully compliant with all data privacy laws, Termageddon is a great solution. This is the tool I use for my all of my legal pages. It auto generates policies based on a few questions I answer about my business and those policies are automatically updated when laws change.
I am not currently using the Termageddon cookie banner solution, but if I had more third party tools embedded in my website, this would help ensure those cookies were managed correctly and included in my privacy policy.
You can save 10% with code SHANNAH or by using my affiliate link. (Full disclosure: I do get a small commission if you purchase using my code or link!)
