If you run a website that collects user data, you’re probably aware of the importance of giving visitors control over their cookie settings. To comply with GDPR, and other privacy regulations, every website must provide an easy way for users to adjust their cookie preferences at any time. Typically, this is achieved through a widget that appears on every page of your website.
However, you may want to make this feature a bit more customizable by customizing the button to other website elements, such as the footer or navigation bar. In this article, we’ll show you how to convert the widget feature into a link, so users can manually reopen their cookie preferences when needed.
Replace the widget with a link
By default, the widget provides quick access to cookie settings from any page. However, if you’d like to replace this widget with a custom link, you can do so in a few simple steps:
- Choose link placement: Decide where to place the cookie settings link. Many websites place this link in the footer and provide a clear label such as “Cookie Settings” or “Manage your Consents.”
- Add the class to the preferred website element: To make the link as functional as the widget, add the following class to the preferred website element, such as a link in the footer:
<a href="javascript:void(0)" class="compliance-cs-preferences-link">Manage your consents</a>
- Test link functionality: After inserting the class, test it by clicking on it to make sure the cookie preferences are displayed as intended.
For Users with US Privacy Rights / CCPA Enable
If your website serves users in the US and you’ve enabled US Privacy Rights in Complianz, use this special class: complicance-cs-uspr-link to create a link for US-specific privacy options, such as the “Notice at Collection.”
In this case, add the following class to the preferred website element:
<a href="javascript:void(0)" class="compliance-cs-uspr-link">Notice at Collection</a>
For Users with IAB Transparency & Consent Framework (TCF) Enabled
If you have enabled the IAB TCF to manage consent for advertising tracking, you must always provide a way for users to update their consent anytime. This link is crucial for complying with TCF standards and ensures users can adjust their consent for advertising tracking.
To meet this requirement, include the following link in your site:
<a href="#" class="complianz-advertising-preferences-link">Update your advertising tracking preferences</a>
Replace the # in the href="#" with the URL that opens the consent modal on your site.
Additional Options for Customizing the Widget
If you decide to keep the widget but want to change its appearance or behavior, here are some additional configuration options available:- Position: Define where the widget will appear on the page using the
floatingPreferencesButtonDisplayoption. Available values includefalse,true,top-left,top-right,bottom-left,bottom-right(default if set to true),anchored-center-left,anchored-center-right, etc. - Button Text: Use
floatingPreferencesButtonCaptionto change the text of the privacy widget button. - Button Icon: You can choose whether to show an icon with
floatingPreferencesButtonIcon. Set this totrue(default) orfalseto hide it. - Hover Effect: To show text on hover, use
floatingPreferencesButtonHover. - Button Shape: You can make the button round by setting
floatingPreferencesButtonRoundtotrue. - Z-Index: If you encounter overlapping issues with other elements on your page, use
floatingPreferencesButtonZIndexto set a custom z-index value.
If your cookie settings don’t open when you first click the link, make sure you’ve clicked the preview in Shopify. This step is important — without it, the link might not work.
Keep in mind that by placing the proper links on your website, you give visitors control over their data. This not only ensures compliance with legal requirements but also gives users the ability to easily adjust their preferences at any time.
