LMT E-Sports

LMT E-Sports extends the Live Match Tracker for competitive gaming titles such as Counter-Strike, League of Legends, Dota 2 and Valorant. The same match.lmtPlus widget is used, but eligible matches are rendered through a Grid.gg embed (game-overview widget) instead of the regular LMT pitch and tabs. Only a small subset of regular LMT properties is supported for these matches.

Previous slideNext slide

See the LMT E-Sports widget demo.

#Supported Content and Environment

#Required Parameters

• widget-name: match.lmtPlus
• matchId or entityId: One identifier is required.
  • matchId: Sportradar numeric match ID for a supported E-Sports sport (e.g. 12345678).
  • entityId: Grid-native match identifier in the form grid:match:<id> (e.g. grid:match:123).

When a Sportradar matchId is used, the widget resolves the match, confirms it belongs to a supported E-Sports sport, and maps it to the corresponding Grid series ID. When grid:match:<id> is used, the widget loads the Grid embed directly for that series.

#Main Configurable Features

Illustrations of the main E-Sports views and relevant property values below.

#API Reference

The table below lists only properties that are passed into and used by the Grid wrapper (src/buildingblocks/lmtPlus/grid/). Standard LMT Plus properties such as scoreboard, momentum, tabs, layout, and pitch customisation are not used for E-Sports matches.

#Theming

Theming for the E-Sports widget is more limited than for the full LMT.

The Grid embed reads colours from the widget theme at runtime. Existing widget theming used for regular LMT applies the same font and colour rules to the E-Sports widget — no extra setup is needed beyond your standard LMT theme.

/* MAIN BACKGROUND COLOR */
.sr-bb {
    background-color: #0f172a;
}

/* DEFAULT TEXT COLOR */
.sr-bb .srt-base-1 {
    color: #e2e8f0;
}

/* PRIMARY COLOR (team accents, buttons) */
.sr-bb .srt-primary-1 {
    background-color: #6366f1;
}

/* HOME TEAM COLOR */

#Tabs Branding

The Grid embed includes its own tab navigation. Tab branding uses the same branding object as regular LMT — see the Customizing Widgets tutorial for the full schema — but for Grid content only branding.tabs.option is supported. That property is a subset of the standard tabs branding API; all other settings (align, variant, iconPosition, icons, arrowIcon, useClientTheming, and namespace-specific overrides) are ignored for E-Sports matches.

The tabs, tabsPosition, and activeTab widget properties (tab reordering and layout) are also ignored for E-Sports matches.

#Streaming

Live video streaming is available for E-Sports matches when a valid jwt is provided and a stream is available for the match.

When streaming is enabled, the Grid game-overview embed shows a stream button. Clicking it opens a stream overlay with the standard LMT video player on top of the Grid content.

To enable streaming:

1. Pass a jwt prop with "av" scope. See JWT Authentication.
2. Ensure stream availability is not suppressed by streamNotAvailableMessage or streamNotAvailableBgImage.

Use the streaming-related properties in the table above to configure player behaviour (streamAutoplay, streamMuteVideo, and others).

#Integration Examples

#Property Name Transformations

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"

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

JavaScript (Programmatic)

Initialize the widget programmatically using the JavaScript API. The widget renders in the specified container element.

HTML (Declarative)

Insert the following HTML code at the target widget location. Complex object properties must be passed as JSON-encoded strings.