Getting Started
- CDN
- React
This guide walks you through how to embed the VTAGZ SDK into your own web experience.
note
This basic example uses the "Popup" experience by default. Check out our other examples for a complete list of use cases.
Prerequisites
Before you begin, ensure you have:
- A VTAGZ Campaign Link - see How to get my Campaign Link?
- A basic HTML page or form where you want to embed the experience
Step 1 - Include the VTAGZ SDK
Paste the following <script> tag in the <head> of your HTML:
<script src="https://cdn.vtagz.com/vtagz.embed-1.8.0.js"></script>
Example
<html>
<head>
<script src="https://cdn.vtagz.com/vtagz.embed-1.8.0.js"></script>
</head>
...
Step 2 - Initialize the SDK
In this step, we'll provide our Campaign Link to create the Popup experience.
We'll add the section below to our <body> section in the same HTML file:
<script>
VTAGZ.open({
link: 'YOUR_CAMPAIGN_LINK', // Replace with your Campaign link
});
</script>
Example
<html>
<head>
...
</head>
<body>
...
<script>
VTAGZ.open({
link: 'YOUR_CAMPAIGN_LINK',
});
</script>
</body>
</html>
That's it! You've just added the VTAGZ Popup experience to your site!
Complete Example
<html>
<head>
<script src="https://cdn.vtagz.com/vtagz.embed-1.8.0.js"></script>
</head>
<body>
<script>
VTAGZ.open({
link: 'YOUR_CAMPAIGN_LINK',
});
</script>
</body>
</html>
This guide walks you through how to use the VTAGZ React SDK in your own React app.
note
This basic example uses the "Popup" experience by default. Check out our other examples for a complete list of use cases.
Install
- npm
- Yarn
- pnpm
- Bun
npm install --save @vtagz/web-sdk-react
yarn add @vtagz/web-sdk-react
pnpm add @vtagz/web-sdk-react
bun add @vtagz/web-sdk-react
Rendering a Popup component
import { Popup } from '@vtagz/web-sdk-react';
export default function Index() {
return (
<>
<div>Hello World!</div>
<Popup link='YOUR_CAMPAIGN_LINK' />
</>
);
}