diff --git a/readme.md b/readme.md index 2d778e9..b425c41 100644 --- a/readme.md +++ b/readme.md @@ -1,220 +1,101 @@ # Cookieconsent Script -A lightweight Javascritp plugin that displays a cookie consent message as required by EU regulation. The plugin displays a message on the user's first visit and they have the ability to consent to different categories of cookies and services. +A lightweight Javascript plugin that displays a cookie consent message as required by EU regulation (GDPR). The plugin displays a message on the user's first visit and they have the ability to consent to different categories of cookies and services. -## Features and configuration +## Features -Currently it can block 4 type of cookie monsters. +Currently it can block all the bad cookie monsters in 4 ways. ### Dynamic script tags -Some services insert dynamically created script tags to the HEAD at page load. This script can block these. - -They're getting blocked by the config value - -``` -type: 'dynamic-script' -``` - -And the script then watches for the search keyword: - -``` -search: 'fbevents.js' -``` +Some services insert dynamically created script tags to the HEAD at page load. These can be intercepted and blocked. ### Script tag blocking -Some services had to be inserted as SCRIPT tag into the source and cant be blocked by only from the front-end since they set cookies with their initial connection. - -They're getting blocked by the config value - -``` -type: 'script-tag' -``` - -Then the SCRIPT tag needs to be modified like this: - -Before: - -``` - -``` - -After: - -``` - -``` +Some third party services require you to insert a script tag into your HTML pages. These can be inactivated until the user allowes them. -And the config **service name** has to have the same name as the "data-consent-value" so the service and the tag can be linked. - -``` -azalead: { - cookieName: 'aza', - name: 'Azalead', - category: 'social', - type: 'script-tag', - search: 'azalead' -} -``` ### Script wrapping -Some services are not inserted in a SCRIPT tag and are obscured by layers of other code. Thats why this plugin creates a global wrapper function what you can use anywhere in your code and will be controlled by the consent. - -They're getting blocked by the config value - -``` -type: 'wrapped' -``` - -Then the SCRIPT you want to controll needs to be wrapped like this: - -``` - -``` - -And the config **service name** has to have the same name as the "data-consent-value" so the service and the tag can be linked. - -``` -wrapped: { - cookieName: 'aza', - name: 'Wrapped cookie', - category: 'social', - type: 'script-tag', - search: 'wrapped' -} -``` +Some services are not inserted in a SCRIPT tag and are obscured by layers of other code. Thats why this plugin creates a global wrapper function what you can use to wrap and blovk any JS code. ### Local cookies -Finally the local cookies set on your domain can be also filtered by overriding the bowsers document.cookie.set method. - -They're getting blocked by the config value - -``` -type: 'localcookie' -``` - -Then you need to set the config search value according to the local cookie names: - -``` -localcookie: { - cookieName: 'aza', - name: 'Local cookies', - category: 'social', - type: 'local', - search: ['localcookie'] or 'localcookie' -} -``` - -The cookie name 'localcookie' will be blocked from being set. - +Finally the local cookies set on your domain can be also filtered by overriding the bowsers COOKIE SET method. ## Usage -The script is currently under development and needs to be built before usage: - -``` -* git clone -* npm run dev -``` - -To build a production ready version of the script: +Include the script **before everything else.** ``` -* git clone -* npm run build + ``` -Then include the plugin into your page as the **first script** in the head tag. - - ### Configuration object -The plugin is being controlled mainly by a configuration object in src/index.js file. It acts as configuration and a state object. - -Insert this before the main script, and change values according your needs. +The plugin is being controlled mainly by a configuration object which is passed to the inital call. It acts as configuration and a global state object. -``` +```javascript ``` \ No newline at end of file