Integration Guides

Learn how to integrate wirelytic.

Installing the Wirelytic script on your website can vary depending on the tools you use.

To make things easier for you, we've created a collection of guides tailored to popular website builders and content management systems (CMS). These guides will walk you through the process, making it a breeze to set up Wirelytic and begin tracking your site visitors.

NextJS

You have the option to utilize the Script element provided by NextJS.

import Script from 'next/script';
 
<Script
  async
  defer
  data-website-key='[KEY]'
  data-api='https://event.wirelytic.com'
  src='https://wirelytic.com/script/wirelytic.min.js'
/>;

React

Add the script in the head section of your index.html

Vue

Vue Tempalte

You can add the script in your vue template

<template>
  <script
    async
    defer
    data-website-key="[key]"
    data-api="https://event.wirelytic.com"
    src="https://wirelytic.com/script/wirelytic.min.js"
  ></script>
</template>

Vue-Meta module

Vue-meta is a vue module that you can install in your application to add metadata and script to the Vue component. This makes it easy to add any script tags to the head tag in individual Vue components.

export default {
  {
    metaInfo: {
      script: [
        { src: 'https://wirelytic.com/script/wirelytic.min.js', async: true, defer: true, data-website-key: "[KEY]", data-api: "https://event.wirelytic.com" }
      ],
    }
  }
}

Vue-head module

vue-head is also a module just like vue-meta, by adding it to your Vue application, you will be able to set metadata in your head tag its individual pages.

export default {
  head: {
      script: [
        { type: 'text/javascript', src: 'https://wirelytic.com/script/wirelytic.min.js', async: true, body: true, data-website-key: "[KEY]", data-api: "https://event.wirelytic.com"},
      ],
    }
}

Wordpress

  1. Get this Plugin to add head code to your wordpress page
  2. Go to Tools -> Head & Footer Code
  3. Add your script to the HEAD Code section