Getting started
The Experience JS SDK provides functions to customize and extend
experiences hosted on the Wyng platform. This SDK publishes functions
accessible using the global wyng
object. Functions can set values,
hide or display content, dispatch events, or register for callbacks.
Your code may be added into the Custom JavaScript field in the Wyng experience editor. Alternatively, if the experience is embedded on a web page as an inline embed, you can access the SDK from JavaScript code on the web page; you should ensure that the experience has loaded before your code runs.
The SDK is located at the window
level and scoped by experience ID.
The methods can be accessed through window.wyng['YOUR EXPERIENCE ID']
.
For convenience and more portable code, when adding JavaScript to the
Custom JavaScript field in the experience editor, use the special
_WYNG_ID_
tag, which will automatically be replaced with the experience ID.
We recommend you scope your custom code with an Immediately-Invoked Function Expression to avoid unintended interactions with other JavaScript when embedding the experience on a web page.
A good starting point is something like this:
(function() {
const sdk = window.wyng['_WYNG_ID_'];
// YOUR CUSTOM JAVASCRIPT
})();
Debug Mode
Arguments:
Argument | Type | Description |
---|---|---|
status | optional - required | argument to control if debug mode should be turned on (true ) or off (false ) (default=on) |
While developing experiences, or even when troubleshooting issues on live experiences it can be useful to have some more information that is normally not visible to the user. Debug mode will do this.
To activate debug mode for an experience run the following code in the console (where 63121234124134
is the experience ID):
window.wyng['63121234124134'].setDebug(true);
To turn off Debug mode after activating it run:
window.wyng['63121234124134'].setDebug(false);