Origami Frontend Components & Services

Demos: o-tracking active

Json Config

Sample configuration for a product.

<!-- Page level configuration must be included prior to loading the module code -->
<script type="application/json" data-o-tracking-config="">
	{
		"server": "https://test.spoor-api.ft.com/px.gif",
		"context": {
			"product": "origami"
		}
	}
</script>

<p>This page is being tracked automatically.  See the source for more details.</p>

<button onclick="document.body.dispatchEvent(new CustomEvent(&apos;oTracking.page&apos;, { detail: { url: document.URL }, bubbles: true}));">Click to send a page event</button>
<button onclick="document.body.dispatchEvent(new CustomEvent(&apos;oTracking.event&apos;, { detail: { category: &apos;element&apos;, action: &apos;click&apos;, form: &apos;submit&apos; }, bubbles: true}));">Click to track a non-page event</button>

<script>
// Send a custom event
function initLocalScript() {
	oTracking.page({ detail: { url: document.URL }, bubbles: true}));
}
</script>

<!-- Include this to ensure that tracking works even when the page does not load o-tracking's JavaScript -->
<div class="o-tracking o--if-no-js"><div style="background-image: url(...)"></div></div>
Switch component view

GitHub Repository

Install o-tracking

If using the Build Service, add o-tracking@^1.4.0 to your script tag.

If running a Manual Build, run bower install --save "o-tracking@^1.4.0".

Help & Support

o-tracking is maintained directly by the Origami team. If you have any questions about o-tracking or Origami in general, we are happy to help. 😊

Slack: #ft-origami
Email: origami.support@ft.com

Feedback / Issues

To report a bug or request features please create an issue on Github. For support or general feedback please get in touch 😊

Slack: #ft-origami
Email: origami.support@ft.com