HTML Code Snippet
Supported technologies
But not limited to..
- Basic web (HTML CSS and Javascript)
- React.js
- Angular
- Vue.js
- Next.js
- Flutter Web
To integrate the Web SDK follow these steps:
- Replace
'Your_App_Key'in the following HTML code with the App Key from your UXCam platform - Copy the snippet and include it in all your HTML files before the closing </head> tag:
<script type="text/javascript" defer="">
(function(appKey, opts) {
window.uxc = {
__t: [],
__ak: appKey,
__o: opts,
event: function(n, p) {
this.__t.push(['event', n, p]);
},
setUserIdentity: function(i) {
this.__t.push(['setUserIdentity', i]);
},
setUserProperty: function(k, v) {
this.__t.push(['setUserProperty', k, v]);
},
setUserProperties: function(p) {
this.__t.push(['setUserProperties', p]);
},
};
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '//websdk-recording.uxcam.com/index.js';
script.async = true;
script.defer = true;
script.id = 'uxcam-web-sdk';
script.crossOrigin = 'anonymous';
head.appendChild(script);
})('Your_App_Key', {});
</script>Verify the integration
- Deploy or serve your site locally
- Check for the
[UXCam] connected successfullymessage in the browser console - Browse a few pages for at least 30 seconds
- Check your UXCam Dashboard — your session should appear after 5 - 10 minutes
Next steps - Setup and configuration
| Step | Task | Goal |
|---|---|---|
| 1 | Configure occlusion Jump → | Hide sensitive user data |
| 2 | Define Pages Jump → | Group similar URLs under consistent names |
| 3 | Set User Identity & Propertie Jump → | Unify sessions, power funnels & cohorts |
| 4 | Add Custom Events Jump → | Track user interactions and key behaviours |
| 5 | Check Content Security Policy Jump → | Ensure the Web SDK functions correctly |
| 6 ★ | Define App version Jump → | Debug issues across different releases |
| 7 ★ | Enable Iframe Recording Jump → | Capture user interactions inside iframes |
Note
Highlights information that users should take into account, even when skimming.
Tip
Optional information to help a user be more successful.
Important
Crucial information necessary for users to succeed.
Warning
Critical content demanding immediate user attention due to potential risks.
Caution
Negative potential consequences of an action.
Success
Negative potential consequences of an action.
Support
For questions or support, reach out to us at [email protected].
Updated 18 days ago
