Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ezrarieben/cookie-z
GDPR compliant cookie warning with automated language detection
https://github.com/ezrarieben/cookie-z
cookie-banner cookie-banner-javascript cookie-consent cookie-consent-javascript cookie-warning english gdpr gdpr-cookie german i18n jquery-plugin language-detection multilingual
Last synced: about 1 month ago
JSON representation
GDPR compliant cookie warning with automated language detection
- Host: GitHub
- URL: https://github.com/ezrarieben/cookie-z
- Owner: ezrarieben
- License: mit
- Created: 2018-06-22T13:31:47.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2021-08-17T12:06:58.000Z (over 3 years ago)
- Last Synced: 2023-03-01T14:41:37.832Z (almost 2 years ago)
- Topics: cookie-banner, cookie-banner-javascript, cookie-consent, cookie-consent-javascript, cookie-warning, english, gdpr, gdpr-cookie, german, i18n, jquery-plugin, language-detection, multilingual
- Language: JavaScript
- Size: 15.6 KB
- Stars: 0
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# cookie-z
A jquery plugin that shows a GDPR compliant cookie warning according to the language set on the users device.
[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
## Setting up cookie-z
1. Import the [jQuery library](https://code.jquery.com/ "jQuery's CDN Page")
2. Load the cookie-z script in your HTML after the body
```html```
3. Create the template for the cookie warning on your page. Example:
```html
```
4. Call the cookie-z plugin on the wrapper of your cookie warning
```javascript
$('.cookie-warning').cookiez();
```
## Changing defaults
1. Use JSON to change the options
1. Example of disabling automated language detection, setting the default language and changing the animation to fade:
```javascript
$('.cookie-warning').cookiez({
autoLang: false,
defaultLang: 'en',
animation: 'fade',
});
```
### Available options
> **NOTE:** if you set `autoLang` to false it will use the default language's text>**NOTE:** if you want to overwrite a language use the `customLanguages` JSON Array
| Option | Description | Default value | Var type |
| -------------------------- | ------------------------------------------------------------------------- | ------------- | --------- |
| `autoLang` | Turning automated language detection on or off. | `true` | `boolean` |
| `defaultLang` | Locale of the language to use if the detected language is not found | `en` | `string` |
| `animation` | Change the animation of toggling the cookie warning (`slide` or `fade`) | `slide` | `string` |
| `fadeTime` | Speed of the fade animation (in miliseconds) | `350` | `integer` |
| `cookieConfName` | Name of the cookie to set when the user has confirmed | `cookie-warning-confirmed`| `string` |
| `customLanguages.[locale].cookieWarning`| Cookie warning text for a custom language (v1.1.0 supports HTML) | `null` | `string` |
| `customLanguages.[locale].btnClose` | Confirm button Text for a custom language (v1.1.0 supports HTML) | `null` | `string` |
| `elements.selectors.wrapper`| Selector for the cookie warning wrapper | `.cookie-warning` | `string` |
| `elements.selectors.text` | Selector for the element to place the warning into | `.cookie-warning-text` | `string` |
| `elements.selectors.btnClose` | Selector for the element the user clicks on to confirm | `.cookie-warning-close` | `string` |
## Predefined languages
1. English
2. German
### Adding your own language
1. When calling the cookie-z plugin add the `customLanguages` JSON Array to the parameters as follows:
```javascript
$('.cookie-warning').cookiez({
customLanguages: {
fb: {
cookieWarning: "foo",
btnClose: "bar"
}
}
});
```
> **NOTE:** the locale of the language in this example is `fb`. After defining the custom language, you can use it as a default language with the `defaultLang` option.
---
[![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)](https://forthebadge.com)
[![forthebadge](https://forthebadge.com/images/badges/made-with-javascript.svg)](https://forthebadge.com)