Skip to main content
The Prediction Builder widget lets visitors on your site build and manage combined predictions by clicking odds cells on Tile widgets. When the builder is active, each clickable cell in a Tile widget becomes a selection. Selections collect in a floating slip that the visitor can review, adjust, and take to a prediction platform. Selections persist in localStorage across page navigations within your site.
The widget type, script attribute, and JavaScript API keep the name bet-builder for compatibility with existing embeds.

Enabling via script attribute

The simplest way to enable the builder is to add data-tallysight-bet-builder-enabled="true" to the SDK script tag:
With this attribute present, the SDK creates the builder widget and appends it to the document body on page load.

Enabling via JavaScript API

Enable and disable the builder at runtime with the Tallysight JavaScript API. This works for toggling the feature based on visitor preferences or page context:
enableBetBuilder() returns a Promise that resolves to true on success or false if the builder could not be initialized. disableBetBuilder() returns true on success. You can also pass the configuration when initializing the SDK programmatically:

How it works

When the builder is enabled:
  1. The SDK creates a widget element with data-tallysight-widget-type="bet-builder" and appends it to <body>.
  2. Odds cells in Tile widgets on the page become interactive. Clicking a cell adds it to or removes it from the current combined prediction.
  3. The floating slip shows the selected predictions, combined odds, and a link to place them on a prediction platform.
  4. Selections are stored in localStorage so they survive page navigation within your site.

Complete embed example

The builder element is created and inserted into the DOM when the SDK initializes with data-tallysight-bet-builder-enabled="true" or when you call Tallysight.enableBetBuilder(). Calling Tallysight.disableBetBuilder() removes the element and clears the stored selections. You do not need to add a data-tallysight-widget-type="bet-builder" element manually.