Betting Entertainment Tools

Widgets Demo

Integration Overview

Examples on how to integrate our BET Assist.

Required parameters are matchId and market.

Name Type Description
matchId Number Match id of game required
market String Market examples (3Way, 1stHalfWin, bothTeamsToScore, totalOverUnder, halfTimeOverUnder, 3WayOvertime, corners, correctScore, whoWillScoreFirst, goalsDifference, doubleChance,...).
All markets for specific sport can be found under Integration > Available Markets or on Bet Assist Widgets Demo page, where you select sport and click on Markets in the side navigation. You can get all available values for all sports if you generate Bet Assist widget on demo page. 		required

Button

Button component has some additional parameters available on API Documentation.

Example

Code
<script>
    (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'
    });
    SIR('addWidget', '.sr-widget-1', 'betAssist.button', { matchId: match_id_here, market: 'market_here' });
</script>
<div class="sr-widget"></div>

Standalone

Check available parameters on API Documentation.

Example
Code
<script>
    (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'
    });
    SIR('addWidget', '.sr-widget', 'betAssist.standalone', { matchId: match_id_here, market: 'market_here' });
</script>
<div class="sr-widget"></div>

Inline

Example

// Hover example styles

Hover over me to see Bet Assist

Code
<script>
    (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'
    });
    SIR('addWidget', '.sr-widget', 'betAssist.standalone', { matchId: 29196972, market: 'bothTeamsToScore' });
</script>

<div class="widget-wrapper">
    <div class="sr-widget"></div>
    <span>Hover over me to see Bet Assist</span>
</div>

Apply some CSS:

.sr-widget {
    display: none;
}
.widget-wrapper:hover .sr-widget {
    display: block;
}
.widget-wrapper:hover > span {
    display: none;
}

If you want to display market widget over other content you can also add other css rules like this:

.sr-widget {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 320px;
    z-index: 1000;
}
.widget-wrapper {
    position: relative;
}

If you want to display market widget in the same width as the parent widget-wrapper just remove width rule:

.sr-widget {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
}
.widget-wrapper {
    position: relative;
}