EN ES EL RU LV PL PT

Football Widgets Documentation

Embeddable football widgets for displaying live matches, league standings, and match schedules. All widgets support automatic timezone detection and customizable base URLs.

Quick Start

Include the widget script in your HTML:

<script src="https://your-domain.com/hello-widget.js" defer></script>

Changing Domain/Base URL

Use the base-url attribute to configure where links point to:

<league-widget league-id="10" base-url="https://betbrothers.football"></league-widget>
Note: All links in the widgets (matches, teams, leagues) will be prefixed with the base-url value. Leave it empty for relative URLs or provide your full domain for absolute URLs.

Language

Set the widget language using the lang attribute (supported: en, es, el, ru):

<all-matches-widget lang="es" show-date-picker="true"></all-matches-widget>
<all-matches-widget lang="el" show-date-picker="true"></all-matches-widget> <!-- Greek -->
<all-matches-widget lang="ru" show-date-picker="true"></all-matches-widget> <!-- Russian -->

Available Widgets

1. League Matches Widget (<league-widget>)

Displays all matches for a specific league.

Parameter Type Required Description
league-id string Yes League identifier (see list below)
base-url string No Domain for links (e.g., "https://betbrothers.football")
lang string No Language (en, es). Default: en

2. League Standings Widget (<league-widget-standing>)

Displays league standings table with positions, points, and form.

Parameter Type Required Description
league-id string Yes League identifier (see list below)
base-url string No Domain for links
lang string No Language (en, es). Default: en

3. All Matches Widget (<all-matches-widget>)

Displays matches from all leagues with optional date picker and status filters.

Parameter Type Required Description
base-url string No Domain for links
date string No Specific date (YYYY-MM-DD format, e.g., "2025-12-18")
show-date-picker boolean No Show date navigation (true/false, default: false)
show-status-filters boolean No Show status filters (All/Live/Finished/Scheduled, default: false)
show-league-filter boolean No Show league/competition dropdown filter (default: false)
league-ids string No Comma-separated league IDs to limit filter options (e.g., "1,10,7,8")
enable-links boolean No Enable links on leagues and matches (default: false)
open-in-new-window boolean No Open links in new window (default: false)
lang string No Language (en, es, el, ru). Default: en

4. Head-to-Head Widget (<h2h-widget>)

Displays head-to-head match history between two teams with statistics and filters.

Parameter Type Required Description
team1 string Yes First team slug (e.g., "athletic-bilbao")
team2 string Yes Second team slug (e.g., "barcelona")
base-url string No Domain for links (e.g., "https://betbrothers.football")
enable-links boolean No Enable/disable match links (default: true)
lang string No Language (en, es). Default: en

5. Horizontal Matches Widget (<horizontal-matches-widget>)

Displays matches in a horizontal scrollable layout with date picker and competition filter. Perfect for embedding in headers or sidebars.

Parameter Type Required Description
league-ids string No Comma-separated league IDs to filter (e.g., "1,10,7,8"). If not provided, shows all leagues.
base-url string No Domain for links (e.g., "https://betbrothers.football")
enable-links boolean No Enable links on matches (default: false)
open-in-new-window boolean No Open links in new window (default: false)
lang string No Language (en, es). Default: en

6. League Matches Widget (<league-matches-widget>)

Displays league matches with a round picker for navigation. Includes league header with season info, current round, and progress bar.

Parameter Type Required Description
league-id string Yes League identifier (see list below)
base-url string No Domain for links (e.g., "https://betbrothers.football")
enable-links boolean No Enable links on matches and teams (default: false)
open-in-new-window boolean No Open links in new window (default: false)
lang string No Language (en, es, el, ru). Default: en

7. Match Widget (<match-widget>)

Displays full match content including header, timeline, statistics, lineups, H2H, and standings. Perfect for embedding a complete match page.

Parameter Type Required Description
match-id string Yes Match identifier
base-url string No Domain for links (e.g., "https://betbrothers.football")
enable-links boolean No Enable links on teams, leagues, and matches (default: false)
open-in-new-window boolean No Open links in new window (default: false)
lang string No Language (en, es, el, ru). Default: en

8. Comprehensive League Widget (<league-full-widget>)

Complete league page experience with tabs for Overview, Fixtures, Results, Standings, and Statistics. All content is non-clickable (no external links). Perfect for embedding a full league experience.

Parameter Type Required Description
league-id string Yes League identifier (see list below)
default-tab string No Initial tab to display: overview, fixtures, results, standings, statistics (default: overview)
lang string No Language (en, es, el, ru). Default: en
Tabs included:

All Available League IDs

Use these league IDs with league-id parameter:

Top European Leagues

La Liga (Spain) league-id="1"
Premier League (England) league-id="10"
Serie A (Italy) league-id="7"
Bundesliga (Germany) league-id="8"
Ligue 1 (France) league-id="16"
Eredivisie (Netherlands) league-id="9"
Primeira Liga (Portugal) league-id="19"
Belgian Pro League league-id="12"

European Competitions

UEFA Champions League league-id="107"
Europa League league-id="117"
Conference League league-id="2492"
UEFA Super Cup league-id="133"

Americas

MLS (USA) league-id="69"
Liga MX Apertura (Mexico) league-id="68"
Liga MX Clausura (Mexico) league-id="141"
Brasileirao (Brazil) league-id="24"
Copa Libertadores league-id="204"
Copa Sudamericana league-id="304"
Canadian Premier League league-id="2119"

England

EFL Championship league-id="25"
FA Cup league-id="139"
EFL Cup league-id="523"

Spain

Segunda Division league-id="2"
Primera RFEF league-id="2468"
Copa del Rey league-id="129"
Supercopa league-id="132"

Italy

Coppa Italia league-id="296"

Germany

DFB-Pokal league-id="140"

France

Coupe de France league-id="325"

Netherlands

KNVB Beker league-id="524"

Portugal

Taca de Portugal league-id="326"

Other European Leagues

Scottish Premiership league-id="14"
Scottish Cup league-id="1500"
Austrian Bundesliga league-id="11"
Danish Superliga league-id="13"
Danish 1st Division league-id="155"
Ekstraklasa (Poland) league-id="128"
Super League Greece league-id="17"
Greek Cup league-id="639"
Turkish Super Lig league-id="37"
Swiss Super League league-id="36"
Slovak Super Liga league-id="35"
Croatian 1. HNL league-id="100"
Cypriot First Division league-id="187"
Premier League Ireland league-id="346"
Latvian Virsliga league-id="371"

Middle East & Asia

Saudi Pro League league-id="61"
Saudi First Division league-id="579"

International Competitions

FIFA World Cup league-id="136"
World Cup Play-offs league-id="134"
FIFA Club World Cup league-id="137"
WC Qualifiers UEFA league-id="119"
WC Qualifiers CONMEBOL league-id="120"
WC Qualifiers CAF league-id="121"
WC Qualifiers AFC league-id="122"
WC Qualifiers OFC league-id="123"
Friendlies league-id="153"

Women's Football

Women's Champions League league-id="1833"
Latvian Women's League league-id="3101"
Tip: The league ID corresponds to the id field from the leagues API. All widgets support the lang parameter for internationalization (e.g., lang="es" for Spanish).

Widget Examples (English)

Below are live examples of each widget in English. You can inspect the HTML to see the implementation.

1. League Matches Widget

Displays matches for Premier League:

<league-widget league-id="10" base-url="https://betbrothers.football"></league-widget>

2. League Standings Widget

Displays Premier League standings table:

<league-widget-standing league-id="10" base-url="https://betbrothers.football"></league-widget-standing>

3. All Matches Widget - Full Experience

With date picker, status filters, and clickable links:

<all-matches-widget show-date-picker="true" show-status-filters="true" enable-links="true" base-url="https://betbrothers.football"> </all-matches-widget>

3.1. All Matches Widget - With League Filter

Full experience with date picker, status filters, league dropdown filter, and clickable links:

<all-matches-widget show-date-picker="true" show-status-filters="true" show-league-filter="true" enable-links="true" base-url="https://betbrothers.football"> </all-matches-widget>

4. All Matches Widget - Fixed Date with Filters

Specific date with status filters:

<all-matches-widget date="2025-12-18" show-status-filters="true" base-url="https://betbrothers.football"> </all-matches-widget>

5. All Matches Widget - Simple

Just matches for a specific date:

<all-matches-widget date="2025-12-18" base-url="https://betbrothers.football"> </all-matches-widget>

6. All Matches Widget - With League Filter

Full experience with date picker, status filters, and league dropdown filter:

<all-matches-widget show-date-picker="true" show-status-filters="true" show-league-filter="true" enable-links="true" base-url="https://betbrothers.football"> </all-matches-widget>

7. All Matches Widget - Limited Leagues Filter

League filter showing only specific leagues (La Liga, Premier League, Serie A, Bundesliga):

<all-matches-widget show-date-picker="true" show-status-filters="true" show-league-filter="true" league-ids="1,10,7,8" enable-links="true" base-url="https://betbrothers.football"> </all-matches-widget>

8. All Matches Widget - Greek Language

All matches widget in Greek:

<all-matches-widget show-date-picker="true" show-status-filters="true" lang="el" base-url="https://betbrothers.football"> </all-matches-widget>

9. All Matches Widget - Russian Language

All matches widget in Russian:

<all-matches-widget show-date-picker="true" show-status-filters="true" lang="ru" base-url="https://betbrothers.football"> </all-matches-widget>

10. Head-to-Head Widget

Displays match history between Athletic Bilbao and Barcelona:

<h2h-widget team1="athletic-bilbao" team2="barcelona" base-url="https://betbrothers.football" enable-links="true"> </h2h-widget>

11. Horizontal Matches Widget

Displays matches in a horizontal scrollable layout with date picker and competition filter:

<horizontal-matches-widget league-ids="1,10,7,8" enable-links="true" base-url="https://betbrothers.football"> </horizontal-matches-widget>

12. Horizontal Matches Widget - All Leagues

Shows all matches without league filter:

<horizontal-matches-widget base-url="https://betbrothers.football"> </horizontal-matches-widget>

13. League Matches Widget - With Round Picker

Displays Premier League matches with round navigation and enhanced league header:

<league-matches-widget league-id="10" enable-links="true" base-url="https://betbrothers.football"> </league-matches-widget>

14. League Matches Widget - La Liga

Displays La Liga matches with round picker:

<league-matches-widget league-id="1" lang="es" enable-links="true" base-url="https://betbrothers.football"> </league-matches-widget>

15. Match Widget - Full Match Content

Displays complete match information including header, timeline, statistics, lineups, H2H, and standings:

<match-widget match-id="22048" enable-links="true" base-url="https://betbrothers.football"> </match-widget>

16. Comprehensive League Widget - Full League Experience

Complete league page with tabs for Overview, Fixtures, Results, Standings, and Statistics (no external links):

<league-full-widget league-id="10" default-tab="overview" lang="en"> </league-full-widget>

17. Comprehensive League Widget - Standings Tab

League widget opening directly to the standings tab:

<league-full-widget league-id="1" default-tab="standings" lang="es"> </league-full-widget>

18. Comprehensive League Widget - Statistics Tab

League widget opening directly to the statistics tab:

<league-full-widget league-id="7" default-tab="statistics"> </league-full-widget>

Integration Tips

Need Help?

For more league IDs, API documentation, or custom widget requirements, please contact the development team or check the API documentation.