--- title: "Custom Bet - Overview" canonical_url: "https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/overview" markdown_url: "https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/overview.md" last_updated: "2026-07-02T07:00:02Z" --- # Custom Bet - Overview The **Custom Bet** widget enables end users to combine multiple market outcomes from a single match into one combined bet with calculated odds. It is intended for sportsbook operators and betting platform developers who need to integrate a bet builder experience into their websites. ![Custom Bet Inline Mode](https://apidocs.sportradar.com/resources/widgets/static/img/customBet.inline.png) Inline mode — widget renders directly in the page ![Custom Bet Market List with Categories](https://apidocs.sportradar.com/resources/widgets/static/img/customBet.market.png) Categorized market with tabs ![Custom Bet Outcome Selection](https://apidocs.sportradar.com/resources/widgets/static/img/customBet.selection.png) Outcome selection view within a market ![Custom Bet Builder with Odds](https://apidocs.sportradar.com/resources/widgets/static/img/customBet.betBuilder.png) Bet builder panel with selected outcomes and calculated odds See the [Custom Bet widget demo](https://widgets.sir.sportradar.com/custom-bet). ### Required Parameters The widget requires **a match identifier** and **a data provider configuration**. **Required:** - **widget-name**: `customBet` - **matchId**: Sportradar match identifier for the event. See [Getting Identifiers](https://apidocs.sportradar.com/resources/widgets/docs/tutorials/getting-identifiers.md). - **dataProviderConfig**: Configuration object containing the functions the widget calls to fetch data and submit bet slip actions. See [Data Provider Configuration](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/api.md#data-provider-configuration). When handling `addToBetSlip`, see [Handling Selections and Odds](https://apidocs.sportradar.com/resources/widgets/docs/tutorials/handling-selections-and-odds.md) for validation and re-pricing. ## Integration Examples Initialize the widget programmatically using the JavaScript [API](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/api.md#api-specification). The widget renders in the specified container element. The widget supports two data provider options: [UOF Proxy](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/integration/uof-proxy.md) for automatic UOF data handling, or [Data Adapter](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/integration/data-adapter.md) for custom data handling. Properties do not always transfer from the above table directly into integration code. Properties must be transformed differently for each integration method: #### JavaScript/Programmatic Integration - Property names remain unchanged in camelCase - Properties become members of the 4th parameter object in `SIR()` call - Example: `cardVariant: "compact"` > **Info** > > In javascript integration, the properties go into an object which is passed as the 4th argument of the call ti `SIR()` function. Please see [Global SIR API](https://apidocs.sportradar.com/resources/widgets/docs/tutorials/SIR.md) #### HTML/Declarative Integration - Convert camelCase to lowercase with dashes, e.g. cardVariant becomes card-variant - Add `data-sr-` prefix - Example: `cardVariant` → `data-sr-card-variant` - Example: `filters.sport.hidden` → Complex objects must be passed as JSON strings > **Info** > > In HTML integration, the properties go into the parent HTML object as object properties, prefixed with `data-sr-` as explained above. > **Only base property support** > > This method supports only simple (base) properties and does not support properties that require functions. > **Info** > > In all examples replace `sportradar` in the widgetloader URL path with your clientId. > > Example if your clientId is `client1`: > > - This URL: `https://widgets.sir.sportradar.com/sportradar/widgetloader` > - becomes: `https://widgets.sir.sportradar.com/client1/widgetloader` > **Info** > > In all examples replace `sportradar` in the widgetloader URL path with your clientId. > > Example if your clientId is `client1`: > This URL: > becomes this: **UOF Proxy - Basic** ```javascript (function(a,b,c,d,e,f,g,h,i){a[e]||(i=a[e]=function(){(a[e].q=a[e].q||[]).push(arguments)},i.l=1*new Date,i.o=f, g=b.createElement(c),h=b.getElementsByTagName(c)[0],g.async=1,g.src=d,g.setAttribute("n",e),h.parentNode.insertBefore(g,h) )})(window,document,"script","https://widgets.sir.sportradar.com/sportradar/widgetloader","SIR", { language: 'en', oddsType: 'eu' }); SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, dataProvider: 'uofProxy', dataProviderConfig: { getFixture, getMarkets, getAvailableMarkets, calculate, getProfile, addToBetSlip } }); ``` Standard UOF Proxy integration. The widget fetches and parses UOF XML internally. You only forward responses. For detailed instructions see [UOFProxy Integration](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/integration/uof-proxy.md). **Data Adapter - Basic** ```javascript (function(a,b,c,d,e,f,g,h,i){a[e]||(i=a[e]=function(){(a[e].q=a[e].q||[]).push(arguments)},i.l=1*new Date,i.o=f, g=b.createElement(c),h=b.getElementsByTagName(c)[0],g.async=1,g.src=d,g.setAttribute("n",e),h.parentNode.insertBefore(g,h) )})(window,document,"script","https://widgets.sir.sportradar.com/sportradar/widgetloader","SIR", { language: 'en', oddsType: 'eu' }); SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, dataProvider: 'custom', dataProviderConfig: { getOffering, calculate, addToBetSlip } }); ``` Data Adapter integration. You control data fetching and return data in the expected format. See [Data Adapter](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/integration/data-adapter.md) for the required response schemas. **Inline Mode** ```javascript SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, isInline: true, dataProvider: 'uofProxy', dataProviderConfig: { getFixture: getFixture, getMarkets: getMarkets, getAvailableMarkets: getAvailableMarkets, calculate: calculate, getProfile: getProfile, addToBetSlip: addToBetSlip } }); ``` Renders the bet builder inline without a button or overlay. The widget appears directly in the `#sr-widget` container. **Full-Screen Overlay** ```javascript SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, isDialogInFullScreen: true, dataProvider: 'uofProxy', dataProviderConfig: { getFixture: getFixture, getMarkets: getMarkets, getAvailableMarkets: getAvailableMarkets, calculate: calculate, getProfile: getProfile, addToBetSlip: addToBetSlip } }); ``` The overlay takes up the full viewport. Designed for mobile devices. **Custom Branding** ```javascript SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, buttonTitle: 'Build Your Bet', productTitle: 'Bet Builder', buttonIcon: 'https://example.com/icons/betbuilder.png', dataProvider: 'uofProxy', dataProviderConfig: { getFixture: getFixture, getMarkets: getMarkets, getAvailableMarkets: getAvailableMarkets, calculate: calculate, getProfile: getProfile, addToBetSlip: addToBetSlip } }); ``` Customize the button text, widget header title, and button icon. **Market Filtering** ```javascript SIR('addWidget', '#sr-widget', 'customBet', { matchId: 50852263, blockedMarketIds: ['30', '18:total=5.5'], mainMarkets: ['oneXtwo', 'total', 'correctScore', 'handicap', 'doubleChance'], dataProvider: 'uofProxy', dataProviderConfig: { getFixture: getFixture, getMarkets: getMarkets, getAvailableMarkets: getAvailableMarkets, calculate: calculate, getProfile: getProfile, addToBetSlip: addToBetSlip } }); ``` Block specific markets and customize the main category content. See [Market Names](https://apidocs.sportradar.com/resources/widgets/docs/custom-bet/market-names.md) for IDs.