How to configure data-elements property globally for all widgets widgets

Global `data-elements` configuration

This improvement allows you to define the data-elements configuration globally for all widgets. Instead of adding the data-elements attribute individually to each widget's HTML, you can now centralize this configuration using the widgetAttributes option in LoadSmpWidget.

This approach helps reduce duplication, improves maintainability, and ensures consistency across all widgets.

How It Works

You can pass a global data-elements configuration through the widgetAttributes property when initializing LoadSmpWidget. Once defined, these settings will automatically apply to all widgets on the page.

The inline data-elements attribute is still fully supported and continues to work as before. This global configuration is provided as a convenient alternative—not a replacement.

If both a global configuration and an inline data-elements attribute are present for a widget, the inline configuration will take precedence. This allows for fine-grained overrides when needed.

Configuration Structure

window.smpFootballWidgets.LoadSmpWidget({
  sdkOptions: { ... },
  widgetAttributes: {
    'data-elements': {
      stats: {
        'team-squad': ['age', 'played', 'goals', 'assists', 'yellow_cards', 'red_cards',     'conceded', 'cleansheets', 'minutes_substitute', 'minutes', 'started'],

        'top-scorers':    ['assists', 'goals', 'minutes', 'missed_penalties', 'penalties', 'played', 'red_cards', 'scored_first', 'yellow_cards'],

        'most-decorated': ['first_yellow_cards', 'red_cards', 'total_cards', 'yellow_cards'],

        'player': { stats: ['played', 'goals', 'shots', 'assists', 'minutes', 'yellow_cards', 'saves', 'cleansheets', 'conceded', 'caught_ball', 'penalties_saved', 'started', 'red_cards', 'substitute_in', 'substitute_out', 'goals_substitute', 'minutes_substitute', 'penalty_goals', 'own_goals', 'shots_on_target', 'offsides', 'fouls_committed', 'penalties_committed', 'penalties_missed', 'penalties_received'] },

        'team': { stats: ['played', 'win', 'draw', 'defeats', 'goals_scored', 'goals_conceded', 'rank', 'points'] },

        'player-h2h': ['assists', 'cleansheets', 'fouls_committed', 'goals', 'goals_substitute', 'minutes', 'minutes_substitute', 'offsides', 'own_goals', 'penalties_committed', 'penalties_missed', 'penalties_received', 'penalties_saved', 'penalty_goals', 'played', 'red_cards', 'shots', 'shots_on_target', 'started', 'substitute_in', 'substitute_out', 'yellow_cards'],

        'team-h2h': ['defeats', 'draw', 'goals_conceded', 'goals_scored', 'played', 'points', 'rank', 'win'],

        'team-h2h-match': ['corners', 'counter_attacks', 'crosses', 'fouls_committed', 'goal_kicks', 'goals', 'offside', 'possession', 'red_cards', 'shots_blocked', 'shots_off', 'shots_on', 'substitutions', 'throw_in', 'treatments', 'yellow_cards'],

        'lineups': [{ name: 'first_team', status: 'opened' }, { name: 'substitutes', status: 'closed' }],
        'standings': {
          desktop: ['matches_played', 'matches_won', 'match_losses', 'match_draw', 'goal_difference', 'points', 'team_form'],
          mobile:  ['matches_played', 'goal_difference', 'points'],
        },

        'match-center': ['corners', 'counter_attacks', 'crosses', 'fouls_committed', 'goal_kicks', 'goals', 'offside', 'possession', 'red_cards', 'yellow_cards', 'shots_blocked', 'shots_off', 'shots_on', 'substitutions', 'throw_in', 'treatments'],
      },
    },
  },
});

Important Notes

The keys defined inside the stats object must exactly match the corresponding data-widget-id values used by each widget.

Each widget will only read and apply the configuration associated with its own data-widget-id.

Any keys that do not match a widget's ID will be ignored.

Updated about 18 hours ago