Origami Frontend Components & Services

Demos: o-tracking

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"

  This page is being tracked automatically. See the source for more details.

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

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

<!-- 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>
active Origami v1 (Bower)
Switch component view

GitHub Repository

Install o-tracking

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

If using the npm package manager for a Manual Build, run npm install --save-peer "@financial-times/o-tracking@^3.1.1".

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: #origami-support
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: #origami-support
Email: origami.support@ft.com