Interactive Demo
Explore UTM Manager's features with live examples. Test attribution strategies, capture parameters, and see events in real-time.
Current UTM Parameters
These are the UTM parameters currently stored in cookies. Try the test links below to see them update.
Manual Parameter Entry
Add UTM parameters manually. Only the five standard UTM parameters are accepted — invalid parameters will show an error.
Try saving a non-standard parameter to see error handling in action.
Supported UTM Parameters
UTM Manager validates parameters against the five standard UTM tags defined by Google Analytics.
Attribution Strategies
Control how UTM parameters are handled when a user visits multiple times with different campaigns.
Only saves UTMs on the first visit. Subsequent visits are ignored.
Always overwrites with the most recent UTM parameters.
Custom callback decides whether to update based on your logic.
Event Log
Real-time log of UTM Manager events and actions. The library fires utmParametersUpdated events when parameters change.
Code Examples
Quick reference for integrating UTM Manager into your project.
// Include the script
<script src="unpkg.com/utm-manager/dist/utm-manager.js"></script>
// Configure (optional)
UTMManager.configure({
attribution: 'first',
expirationDays: 90
});
// Get all parameters
const params = UTMManager.getAllUTMs();
// Listen for updates
window.addEventListener('utmParametersUpdated', (e) => {
console.log(e.detail);
});
import { useUTMs } from 'utm-manager/react';
function App() {
const { params, setParam } = useUTMs({
autoCapture: true,
attribution: 'first',
onUpdate: (params) => {
analytics.track(params);
}
});
return <pre>{JSON.stringify(params)}</pre>;
}