Betting Entertainment Tools

Widgets Demo

Highlights Widget

Parameters
Name Type Attributes Default Description
props object
user string | number

User ID.
count number 24|5

The number of cards to display. Must be a number between 1 and 48. If cardVariant is set to table, the default value is 5. Otherwise, the default value is 24.
cardsLayout 'horizontal' | 'vertical' 'horizontal'

Set how events within a recommendation category are displayed.
categoryLayout 'tabs' | 'expanded' 'tabs'

Set how the recommendation categories are displayed.
cardVariant 'default' | 'compact' | 'table' 'default'

Set the style of the event card.
outcomeNamePosition 'start' | 'end' | 'top' | 'bottom' 'start'

Positioning of outcome name.
filters.recommendationType.available Array.<('recommended'|'popular'|'trending')>

Change display order by shuffling array values.
filters.time.active Array.<('live'|'not_started')>

Array of active time filters.
onItemClick OnItemClick Widgets.BetRecommendation.Integration.OnItemClick

Set a callback to run when the event or outcome is clicked. For more information check OnItemClick.
Examples

#1

<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('registerAdapter', '{ADAPTER_NAME}');

    SIR('addWidget', '#sr-widget', 'betRecommendation');
</script>
<div id="sr-widget"></div>

#2

<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('registerAdapter', '{ADAPTER_NAME}');

    SIR('addWidget', '#sr-widget', 'betRecommendation', {
         count: 10,
         maxRows: 2,
         filters: {
             recommendationType: {
                 hidden: false,
                 available: ['popular', 'recommended', 'trending'],
                 active: 'trending' // one value from `available`.
             },
             sport: {
                 hidden: false,
                 available: ['1', '2', '5', '20'], // Sportradar sport ids.
                 active: ['2'] // one value from `available`.
             },
         },
         branding: {
             sports: {
                 icons: { // custom icons for sports
                     1: 'path_to_image_file',
                     2: 'path_to_image_file',
                     5: 'path_to_image_file',
                     20: 'path_to_image_file'
                 }
             }
         },
         onItemClick: function(target, data) {
             console.log(target, data);
         }
    });
</script>