Back to guides

How to implement the widget with Nuxt.js application

Follow these steps to implement the Userway widget in a Nuxt.js application:

  1. Locate Nuxt Configuration File:Look for a file named nuxt.config.js.
  2. Add Userway Script to Head:Add the script inside the head, as follows:Before:
    1. export default {
           // Global page headers: https://go.nuxtjs.dev/config-head
      head: {
         title: ‘My Nuxt.js App’,
         meta: [
      { charset: ‘utf-8’ }, { name: ‘viewport’, content: ‘width=device-width, initial-scale=1’ },
      { hid: ‘description’, name: ‘description’, content: ‘My awesome Nuxt.js app’ }
      ],
          link: [
      { rel: ‘icon’, type: ‘image/x-icon’, href: ‘/favicon.ico’ }
      ],

      After:

      export default {
           // Global page headers: https://go.nuxtjs.dev/config-head
      head: {
         title: ‘My Nuxt.js App’,
         meta: [
      { charset: ‘utf-8’ }, { name: ‘viewport’, content: ‘width=device-width, initial-scale=1’ },
      { hid: ‘description’, name: ‘description’, content: ‘My awesome Nuxt.js app’ }
      ],
          link: [
      { rel: ‘icon’, type: ‘image/x-icon’, href: ‘/favicon.ico’ }
      ],

          script: [
          { src: ‘https://cdn.userway.org/widget.js’, ‘data-account’: ‘your ID’}
      ]
      },

     

  3. Modify Userway Account ID:Modify the value of data-account attribute to your own account ID.
  4. Save and Test:Save the file and test the widget on your website.

Explore UserWay’s Accessibility Widget