Trigger Native Code when an Experience is Triggered

Overview

Visually can call a JavaScript function on your website every time it applies an experience, so your own code can react to it. Define window.vslyOnExperienceApplied and Visually calls it with the details of each experience that is applied.

Set it up

1. Define the function before the Visually SDK. If you can't define it before the SDK please read below.
   

   window.vslyOnExperienceApplied = (experience) => {
    console.log('vsly', experience); 
   };

2. Replace the console.log line with your own logic.
3. Open a page where an experience applies and check that your logic is calling.

What the callback receives

The callback receives an object that identifies the experience and the variation that was applied.

When it fires

The callback fires when an experience is triggered on the device.

How to define the function after the SDK has applied an experience

Put a small inline, synchronous callback above the Visually SDK to queue events:

window.triggeredExperiencesQueue = [];
window.vslyOnExperienceApplied = function (event) {
window.triggeredExperiencesQueue.push(event);
};

Then, process the queue and replace the callback when you need it:

function processExperience(event) {
// Your integration logic
}
const queued = window.triggeredExperiencesQueue || [];
window.vslyOnExperienceApplied = processExperience;
window.triggeredExperiencesQueue = [];
queued.forEach(processExperience);

What you can build with it

• Native theme changes. Apply changes in your own theme based on the triggered experience.
• Custom integrations. Send the experience and variation details to your own tools.