Odds

A single event's betting odds for one market — the operator's branded box, then each outcome with its price. Prices refresh on an interval and show an arrow when they move. It is the same strip the Predictor, TopX, Event Card, Competitor Card and Competition Statistics widgets render, on its own, so it can sit anywhere in an article.

<div data-component="fu-widget" data-content-type="odds" data-content-id="fb:m:536871"></div>

Configuration Attributes

Per-element attributes override the global odds config field by field, including inside affiliateIds and labels.

Markets

When no operator prices the market completely, nothing renders.

Sizes

Betslip

The widget owns no betslip. Set data-odds-add-to-betslip="true" to push a clicked price into the Betslip widget on the same page as a selection ({matchId}:{market}:{outcome} — e.g. fb:m:536871:OVER_GOALS_2_5:OVER, the same id FuWidget.betslip.setSelection takes). The operator's own link opens on click either way.

To observe clicks yourself, set odds.callbacks.onAddToBetslip in FuWidget.init(). It receives { matchId, market, pick, odd, operatorId } — market is the code the price came from, so "WINNER_OT" when FT_1X2 fell back to it — and runs whether or not addToBetslip is on. It takes an argument, so there is no data-attribute equivalent.

<div
	data-component="fu-widget"
	data-content-type="odds"
	data-content-id="fb:m:536871"
	data-odds-market="OVER_GOALS_2_5"
	data-odds-operators="betano-bg"
	data-odds-add-to-betslip="true"
></div>
<div data-component="fu-widget" data-content-type="betslip"></div>

Global Configuration

Set defaults for all Odds widgets in FuWidget.init():

FuWidget.init({
	// ... other config
	odds: {
		market: "FT_1X2",
		size: "default",
		mode: "default",
		flashInterval: 3000,
		pollingInterval: 30000,
		operators: ["betano-bg", "efbet-bg"], // Preference order — one operator is shown
		affiliateId: "aff-123", // Substituted into operator URLs carrying {affiliate_id}
		affiliateIds: { "efbet-bg": "aff-456" }, // Per operator; wins over affiliateId
		labels: { title: "Match odds", over: "Over {{line}}", under: "Under {{line}}" },
		addToBetslip: true,
		callbacks: {
			onAddToBetslip: (selection) => console.log(selection), // Optional: observe clicked prices
		},
	},
});

Examples

Over/Under 2.5 Goals in a Sidebar

<div
	data-component="fu-widget"
	data-content-type="odds"
	data-content-id="fb:m:536871"
	data-odds-market="OVER_GOALS_2_5"
	data-odds-size="dense"
></div>

Flashing Both-Teams-to-Score Row

<div
	data-component="fu-widget"
	data-content-type="odds"
	data-content-id="fb:m:536871"
	data-odds-market="BOTH_TEAMS_SCORE"
	data-odds-size="compact"
	data-odds-labels='{"title":"Both teams to score"}'
></div>

Features

• One event, one market: 1X2 (two-way for sports that cannot be drawn), half-time 1X2, both teams to score, over/under goals and corners
• One operator, picked from your preference order — the first that prices the market completely
• default, dense and compact sizes; compact flashes the operator and the prices
• Price movement arrows, refreshed on a configurable interval
• Affiliate ids substituted into the operator links, globally or per operator
• Betslip hand-off via data-odds-add-to-betslip, plus an onAddToBetslip observer
• Renders nothing when no operator prices the market completely