How to record an event in the browser

Most of the time, you will record events via JavaScript in your browser. This is the easiest approach, and can require just a single line of code.

All events are logged via the silktide() function, like so:

silktide("event_name", options); 

Depending on your event_name, you may need to specify different options, or no options at all. For example, this is a custom event with no options:

silktide("add-to-basket"); 

And these are the options for a built-in frustration event:

silktide("frustration", {
  "selector": ".foo a",
  "description": "Form error",
  "x": 50,
  "y": 50
});

See all built-in events, and custom events for details on what options you need.

Example recording an event when a button is pressed

Say you have the following HTML button, and you want to record a custom add-to-basket event whenever it is pressed:

<button>Add to basket</button>

If you don’t already have an easy way to identify this button, you should give it an id, for example basket-button:

<button id="basket-button">Add to basket</button>

You can now add JavaScript to listen to that button being clicked on:

<script>
  var button = document.getElementById('basket-button');
    
  button.addEventListener('click', function (e) {
    silktide("add-to-basket"); 
  });
</script>

How do I know JavaScript events will be recorded?

So long as you run the silktide() function before loading a new page, Silktide should receive the event. There is no need for a callback that might delay the new page from loading.

This is because Silktide buffers all events and sends them when the page is unloaded via a beacon. Beacons are sent after the page has unloaded – even if the tab is closed – and so your events don’t need to wait for the message to be received on our end.