npm install
npm run serve
npm run build
npm run test:unit
npm run lint
WIP
Add to your app main js or ts file:
import CookieBar from '@altescape/vue-cookie-bar-plugin'
Vue.use(CookieBar, {
havenOptions: {
domains: ['.example.com'],
services: [
{
name: 'google-tag-manager',
purposes: ['analytics'],
type: 'google-tag-manager',
inject: true,
options: {
id: 'GTM-T4P1234',
},
},
],
},
})
Then place the following in a single main Vue file such as App.vue
:
<CookieBar>
<template v-slot:title>🍪 Can we use optional cookies?</template>
<template v-slot:text>
These cookies help us keep our website safe and give you a better
experience. We won’t turn them on unless you accept. Want to know more
or adjust your preferences? Here's our
<a href="https://www.example.co.uk/legal/cookies/">cookie policy</a>
</template>
</CookieBar>
The plugin uses and exposes Haven as $haven
. A list of options to inject into havenOptions
when initialising the plugin can be found here.
Note: The plugin was only intended to show the cookie notification (and capture the preferences), but it can also display cookie preferences that allow updates to cookie consent (such as on a cookies policy page) where consent can be updated.
You can add this functionality easily by adding <div id="cookie-preferences"></div>
anywhere on a page or in a component. See here for a list of available options.