Vue.js

Vue.js is a progressive framework for building user interfaces. It is designed from the ground up to be incrementally adoptable, and can easily scale between a library and a framework depending on different use cases. We also provide an implementation guide to it.

Vue.js is a progressive framework for building user interfaces. It is designed from the ground up to be incrementally adoptable, and can easily scale between a library and a framework depending on different use cases. We also provide an implementation guide to it.

Install vue-head

Install vue-head.
Follow vue-head’s documentation of how to insert a script in the <head> of an application.

CMPv1 Code

Add the following two scripts to the <head>-section of your nuxt.config.js file for CMP V1 Settings-ID:

CMPv2 Code

If you are using CMP V2 Settings-ID, please add these below two scripts to the <head>-section of your nuxt.config.js file:

script:  [
      { type: 'application/javascript', src: 'usercentrics-helper.js'},
      { type: 'application/javascript', src: 'https://app.usercentrics.eu/browser-ui/latest/loader.js', id: 'usercentrics-cmp', 'data-settings-id':'XXXXXXX'}
    ],

TCF2 Code

If you are using TCF 2.0 Settings-ID, please add these below two scripts to the <head>-section of your nuxt.config.js file:

script:  [
      { type: 'application/javascript', src: 'usercentrics-helper.js'},
      { type: 'application/javascript', src: 'https://app.usercentrics.eu/browser-ui/latest/loader.js', id: 'usercentrics-cmp', 'data-settings-id':'XXXXXXX', 'data-tcf-enabled': true }
    ],

Implementation

Replace “XXXXXX” with your Usercentrics SettingsID.
Add a “usercentrics-helper.js” file to your “./static” directory.
Insert the following code into the “usercentrics-helper.js” file:
window.usercentrics = { settingsId: 'XXXXXX' }; window["usercentrics"] = { paths: { "bundle": "https://app.usercentrics.eu/latest/bundle.js", }, settingsIds: 'XXXXXX', settingsVersionOverwrite: 'preview', };
Replace “XXXXXX” with your Usercentrics SettingsID.

Do you need further help?

How can I get help with technical questions?