The Privacy Suite for WordPress

CSS Lesson #14: Icons in the Manage Consent button

Get compliant today in the European Union, United States, Canada, United Kingdom, Australia, Brazil & South Africa with the only Privacy Suite for WordPress that offers a fully-featured plugin for Worldwide Compliance.

Complianz inserts a “Manage consent” button, allowing users to change their consent preferences at any time.

Using some Custom CSS, you can add Font Awesome icons to this button to fit the style of your website even better. At the end of this article, we also explain how you can create a custom Manage Consent button.

Basic “Manage consent” button

First, let’s insert the CSS to change the default Manage Consent button to a black rectangle with white text as shown in the example image below.

Insert an icon before the text

Your website needs the Font Awesome 5 library before you can insert icons with the CSS code in this article. You can install the Font Awesome plugin to do this. Upon activation, you can use the CSS below to insert an icon to your button.

The result should look similar to this:

The properties can be changed to make the button style fit your preferences. For example, you can change the icon color separately from the Manage consent text as shown in the final result:

The result

 

Adding a custom Manage Consent button

If more customization possibilities are desired, you might opt to create your own, custom button instead. We’ve already created one that is ready to be implemented, example below or on really-simple-plugins.com:

Unlike the earlier CSS examples, the code for this custom button should either be implemented as an MU-Plugin (recommended), with a plugin such as Header & Footer Code Manager, or in the functions.php file of your (child) theme.

Recent articles

The Privacy Suite for WordPress
Get compliant today with the only Privacy Suite made for WordPress

Categories

Popular articles

LGPD Brazil and WordPress

The “Marco Civil” and the Brazilian General Data Protection Law (LGPD) In Complianz 5.4 we will add full support for the Civil Rights Framework for

Read More

Join our mailing list - 8 Tips & Tricks in your inbox over the next 8 weeks!