Cookie consent for developers

Descrizione

This plugin is intended primarily for developers, although any WordPress user with knowledge of HTML and JavaScript can use it. The plugin implements the logic of dealing with cookies as required by EU regulation and explained here. There is also This European commission page which explains basic things about cookies and legislation which regulates their usage.

With proper use, you can make your website GDPR and PECR compliant. The basic principles are that user must be clearly informed about cookies that you use on a webpage (even from external services – web pages), and that user should be given a choice to decide if he wants to accept these cookies. The exception are cookies that do not identify computer (without unique identificator) and which are necessary for proper page functioning, like remembering shopping basket in an online store.

Why should I use this particular plugin?

Because it is free from bloatware, no additional CSS, JavaScript or other files are used in frontend. It offers smooth integration with minimal footprint; all code and HTML is placed inline in HTML of the page. The stress of the plugin is on simplicity, which also gives developers open hands to do customizations as preferred and needed. It is made to be cache – friendly; it means that it offers the same version of the page each time, no matter if user chose to opt-out of cookie usage, accepted cookies or has not yet decided. Plugin has been tested on “Cache Enabler” plugin, but it should work with other caching plugins and technologies as well. Only exception is YouTube videos which URL’s are replaced in situ in the backend, effectively making it a little different page for the caching plugin. However, this is necessary, since this YouTube code should not place any cookies if user has decided to opt-out, therefore URL exchange could not be done after the page loads.

How to use

There is a setup page titled “Cookie consent for developers” on admin panel in standard menu item ‘Tools’. It is important to understand how plugin works, and that you should divide JavaScript that places cookies into “working horse” part, which places cookies and does other things and part which starts that “working horse”.

On the plugin settings page, you should give short information about cookies or other similar technologies (from now on I will refer simple as “cookies”, although that also refers to local storage, session storage, …) used and ID of the page which tells user more about use of such technologies. This info shows as info window and is customizable via CSS. Two examples, css_example1.css and css_example2.css are given to show different styling of this info window (or ribbon). The “learn more” page (whose ID is given) should also provide mechanism to choose between allowing only necessary cookies or allowing all cookies. More about this page later.

Then you have to enter code in the header and footer, which places cookies and the code that calls that code, separately. In this way, the code that places cookies is executed only when user allows.

Finally, you can enter opt-out code, which will block functions which place cookies if user decides not to use them.

There is also possibility to enter custom code which will run on window load event (when page fully loads) which you can use to add special effects to info window or anything else you wish.

Learn more page

On learn more page (you have to build it yourself) you should explain about the cookies and their usage in simple and understandable way to general public. The information about all cookies on your web and their purpose should be given (including third-party).

Important: Two buttons (or links) should also be given on this page, with id’s: btnAcceptCookies and btnRefuseCookies (without apostrophes). These buttons shall be used to enable user to choose if cookies will be used or not (except necessary ones).

Styling

You can use two provided styles, or (very likely) do your own styling. If you choose option “Not used” in the settings, you should put custom CSS in theme or other styling CSS file, while if you choose “Custom CSS file”, you should provide separate CSS file.

This separate CSS file should be named ccfd_custom.css and should be placed in the root of your theme directory, or you can use filter named ccfd_custom_css_name to provide custom string for your CSS file. The same full path, like for wp_enqueue_style should be given.

Live examples of two given styles you can see on pages Topomatika or Cetina.

Ideally, you should put styling in your main theme stylesheet, or however you find more appropriate.

YouTube

The plugin has special function for YouTube. If user decides to opt-out from cookies, all YouTube URL-s will be replaced with youtube-nocookie versions. This will also work for shortened URL’s like https://youtu.be. In this way, YouTube videos will still function, but they will not use cookies.

Languages

English and Croatian so far.

Screenshot (schermate di esempio)

  • Top part of settings section
  • Bottom part of settings section
  • Example of styling #1
  • Example of styling #2

Installazione

Install and activate plugin from WordPress

or

  1. Upload cookie-consent-for-developers to the /wp-content/plugins/ directory
  2. Activate the plugin through the ‘Plugins’ menu in WordPress

Go to Tools -> 03GO Cookie consent and fill the plugin settings

FAQ

I will readily answer your questions.

Crediti e riconoscimenti

“Cookie consent for developers” è un software open source. Le persone che hanno contribuito allo sviluppo di questo plugin sono indicate di seguito.

Collaboratori

Traduci “Cookie consent for developers” nella tua lingua.

Ti interessa lo sviluppo?

Esplora il Codice segui il Repository SVN iscriviti al Log delle Modifiche. Puoi farlo tramite RSS con un lettore di feed.

Changelog (registro delle modifiche)

1.2

Added option to set Cookie expiry interval

1.1

Added possibility to choose between two pre-made CSS files, no file or custom style file which should be edited by developer.

1.0

  • First version, fully functional, try it 😉