The Dot.vu Embed Library is a javascript library which enables you to embed your interactive experiences on your website.
The basic and most common use of the Dot.vu Embed Library is to simply embed a page on your website. However, you can also use it to communicate between your embedded Dot.vu experience and your website, by using the Dot Embed Library Add-On.
There are several options for sending and retrieving information from the embedded dot.vu page, which are:
- Initialize the Dot.vu page with URL Data
- Subscribe to triggered events
- Get the value of a session data field
- Set the value of a session data field
- Run a Custom Action
All possible use cases of the Dot Embed Library are exemplified in the code below. Note that when the load method is called, a callback will then be called, once the page is ready, with a Page instance as function argument. Once you have access to the Page instance, you can start to use it to handle events, actions and data fields.
// Dot.vu page's config
var config = {
dotId: 155,
pageId: '60ab77612d249b5070590e07',
loading: 'on',
height: 'auto',
width: '100%',
// optional url data to send to the page (requires URL Data Add-On)
urlData: {
customerId: '123',
},
}
window.dotEmbed.load(el, config, function (page) {
var events = page.events
var actions = page.actions
var datafields = page.datafields
// Subscribe to triggered events.
events.subscribe('new-lead', function (lead) {
console.log(lead)
})
// Get a session data field value
datafields.get('counter').then(function (value) {
console.log(value)
})
// Set a session data field value
datafields.set('counter', 10)
// Run a custom action
actions.run('showButton')
})