Giter Club home page Giter Club logo

librairie-cookie-consent's Introduction

Logo de la librairie

cc by-nc-sa 4.0 Issues
Releases Forks Stars Watchers

librairie-cookie-consent

Because the users' agreement counts.

This easy-to-use library allows you to ask your users for feedback on various parameters that can be set directly in the code. For more information, see the README documentation. IMPORTANT NOTE: for use with jQuery.

Demo

Exemple

If you want to see the result directly, download the latest release, and go to the Example folder. Then run the index.html file. You can see below the popup of the library, below, of course, the style is fully configurable in the CSS document.

Popup

Popup

How to install it ?

You can download the entire library in three different ways:

  • via the library-cookie-consent release page.
  • via NPM : npm install librairie-cookie-consent
  • via Bower : Not yet available

How to use it ?

Before starting any manipulation with the library, the CSS file popupConsent.css, the file popupConsent.js or popupConsent.min.js, and the jQuery framework must be included. For example, our <head> could look like this:

<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="css/popupConsent.css">
  <script src="js/popupConsent.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <title></title>
</head>

You don't have to include jQuery and popupConsent.js/popupConsent.min.js between the <head> tags, but you must include jquery before popupConsent.js/popupConsent.min.js and before calling the popupConsent() function.

Once these three files are included in our page, , you can create a popup using the popupConsent(); function. The question now is how does this function work ? It's actually quite simple, just create a cookieConsentOptions variable with an array, like the example below.

var cookieConsentOptions = {
	// Cookie usage prevention text
	textPopup: 'We use cookies/targeted advertising to ensure you have the best experience on our site. If you continue to use our site, we will assume that you agree to their use. For more information, please see our <a href="#">privacy policy</a>.',
	// The text of the accept button
	textButtonAccept : 'Accept all',
	// The text of the configure my options button
	textButtonConfigure : 'Configuring choices',
	// The text of the save my options button
	textButtonSave : 'Save choices',
	// You can add as many permissions as you like. These permissions can be set in the "configuration" section.
	authorization: [
		// For each authorisation, you must specify its text and the name of its cookie.
		{
			textAuthorization: 'Allow access to geolocation data',
			nameCookieAuthorization: 'autoriseGeolocation'
		},
		{
			textAuthorization: 'Allow personalised ads and content, ad measurement and audience analysis',
			nameCookieAuthorization: 'targetedAdvertising'
		},
		{
			textAuthorization: 'Storing and/or accessing information on a device',
			nameCookieAuthorization: 'cookieConsent'
		}
	]
}
popupConsent(cookieConsentOptions);

But how to recover the user's choices? You will see, it's quite simple. The cookie names you specify are stored in the user's browser. If he has accepted all cookies, all cookies will be set to "true". If the user refuses some choices, the cookie will be set to "false".

librairie-cookie-consent's People

Contributors

clement-gaudiniere avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar

Forkers

black-aigle

librairie-cookie-consent's Issues

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.