# iubenda-module > Easily integrate Iubenda with Nuxt.js Latest version **0.1.3** (published 2024-03-04) · MIT license · 0 weekly downloads ## Install ```sh npm install iubenda-module pnpm add iubenda-module yarn add iubenda-module bun add iubenda-module ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.1.3 | | Published | 2024-03-04 | | First published | 2021-05-27 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 2 | | Unpacked size | 14.1 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 4 | | Maintainers | yensmaneuver, davidmaneuver | ## Links - npm: https://www.npmjs.com/package/iubenda-module - Repository: https://github.com/maneuver-agency/iubenda-nuxt-module - Homepage: https://github.com/maneuver-agency/iubenda-nuxt-module#readme - Issues: https://github.com/maneuver-agency/iubenda-nuxt-module/issues - npm.io page: https://npm.io/package/iubenda-module ## Dependencies (2) - [lodash.template](https://npm.io/package/lodash.template.md) ^4.5.0 - [object-assign-deep](https://npm.io/package/object-assign-deep.md) ^0.4.0 ## Recent versions - 0.1.3 (latest) — 2024-03-04 - 0.1.2 — 2022-06-27 - 0.1.1 — 2022-03-02 - 0.0.7 — 2021-11-22 - 0.0.6 — 2021-05-27 - 0.0.5 — 2021-05-27 - 0.0.4 — 2021-05-27 - 0.0.3 — 2021-05-27 - 0.0.2 — 2021-05-27 ## README # Iubenda Nuxt Module [![npm version][npm-version-src]][npm-version-href] [![npm downloads][npm-downloads-src]][npm-downloads-href] [![Github Actions CI][github-actions-ci-src]][github-actions-ci-href] [![Codecov][codecov-src]][codecov-href] [![License][license-src]][license-href] > Easily integrate Iubenda with Nuxt.js [📖 **Release Notes**](./CHANGELOG.md) ## Setup 1. Add `iubenda-module` dependency to your project ```bash yarn add iubenda-module # or npm install iubenda-module ``` 2. Add `iubenda-module` to the `modules` section of `nuxt.config.js` ```js { modules: [ // Simple usage 'iubenda-module', // With options ['iubenda-module', { /* module options */ }] ] } ``` ## Module Options ```js { iubenda: { // Defaults: dev: true, // Activate module in dev environment. consentMode: true, // Use Google's consent mode. links: { enable: true, // Add script to include links to policy pages. style: 'nostyle', // Add styling to links. (nostyle, white or black) whiteLabel: true, // White label links. embed: true // Open links in embedded popup. }, // Entire iubenda configuration config: { siteId: 12345, // Required cookiePolicyId: 12345, // Required // ...all other config options. (See Iubenda cookie banner script) // Example defaults: lang: 'en', gdprAppliesGlobally: false, cookiePolicyInOtherWindow: false, consentOnContinuedBrowsing: false, perPurposeConsent: true, banner: { acceptButtonDisplay: true, customizeButtonDisplay: true, rejectButtonDisplay: false, acceptButtonColor: 'black', acceptButtonCaptionColor: 'white', customizeButtonColor: '#bbb', customizeButtonCaptionColor: 'black', rejectButtonColor: 'white', rejectButtonCaptionColor: 'black', closeButtonDisplay: false, position: 'float-bottom-right', textColor: '#333', backgroundColor: '#ddd' } } i18n: {} // See integrations. } } ``` ## Use in Vue templates The included plugin provides the following properties to use in your Vue components: ```js $iubenda.privacyPolicyUrl // Link to privacy policy $iubenda.cookiePolicyUrl // Link to cookie policy $iubenda.privacyPolicyApiUrl // Url to use in an API call for the privacy policy $iubenda.cookiePolicyApiUrl // Url to use in an API call for the cookie policy $iubenda.getPrivacyPolicyLinkHtml('Label', attributes) // Link tag to the privacy policy page / popup $iubenda.getCookiePolicyLinkHtml('Label', attributes) // Link tag to the cookie policy page / popup ``` Example: ```html ``` Will render (depending on your 'links' options): ```html
Privacybeleid Cookiebeleid
``` ## Components ### PageEmbed Used to embed the cookie policy and privacy policy page in your site. Import component. ```js import PageEmbed from 'iubenda-module/lib/components/PageEmbed.vue' ``` Use in template. ```html ``` #### Props - type: Can either be 'cookie' or 'privacy'. Defaults to 'privacy'. - loadingText: The text shown when the content is being fetched. Defaults to 'Loading content...'. - errorText: The text shown when the fetch has failed. Defaults to 'Error fetching content'. ## Integrations ### nuxt/i18n !! Work in progress... Currently only the PageEmbed component inherits the locale from the i18n module. You only have to set the correct configuration as below. #### Configuration ``` // nuxt.config.js { iubenda: { // ...other options i18n: { en: { cookiePolicyId: 123456 }, nl: { cookiePolicyId: 123456 } } } } ``` ## License [MIT License](./LICENSE) Copyright (c) David De Coninck [npm-version-src]: https://img.shields.io/npm/v/iubenda-module/latest.svg [npm-version-href]: https://npmjs.com/package/iubenda-module [npm-downloads-src]: https://img.shields.io/npm/dt/iubenda-module.svg [npm-downloads-href]: https://npmjs.com/package/iubenda-module [github-actions-ci-src]: https://github.com/maneuver-agency/iubenda-nuxt-module/workflows/ci/badge.svg [github-actions-ci-href]: https://github.com/maneuver-agency/iubenda-nuxt-module/actions?query=workflow%3Aci [codecov-src]: https://img.shields.io/codecov/c/github/maneuver-agency/iubenda-nuxt-module.svg [codecov-href]: https://codecov.io/gh/maneuver-agency/iubenda-nuxt-module [license-src]: https://img.shields.io/npm/l/iubenda-module.svg [license-href]: https://npmjs.com/package/iubenda-module --- _Source: https://npm.io/package/iubenda-module · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._