Filters and leagues column
Let visitors narrow the Livescore list by team, competition or country, and add a column of competitions beside the matches.
The Livescore can help visitors find their match in a long day: a search field that narrows the list as they type, Country and League menus, and a column of competitions beside the matches, on the left or on the right, as on most score sites. Everything is off until you turn it on, and each part has its own switch.
The status stays in the tabs
The Today, Live, Upcoming, Finished and My matches tabs already filter by status, so there is no separate status filter. The search, the menus and the column filter inside the tab that is open, and while a filter is on, the tab counters count only what it lets through. On Today every status tab gets its filtered count; on another tab only that tab's count is known, so the others hide their number until the filter is cleared.
Filters are part of what the visitor is looking at, like the open tab: they are not saved, they do not change the page address, and each widget on a page has its own.
Search in the list
Plans
Turn on Search in list in Livescore navigation items to add a search field under the toolbar. As visitors type, the list keeps only the matches whose home team, away team, competition or country contains what they typed:
- accents and capitals do not matter (atletico finds Atlético, besiktas finds Beşiktaş, bodo finds Bodø), and each word can match a different name (japan niigata);
- the matching words are highlighted in the list, and every competition with a match opens;
- the toolbar says how many matches remain, for example 5 of 1,514, with Clear filters next to it. Screen readers hear the same count once the visitor stops typing.
It searches the list the widget has already loaded, so it costs no extra requests and works on every plan. Names are matched as the SoccersAPI data spells them in the widget's language.
With search in the list on, the toolbar has one search field instead of two: the search dialog is still one click away as Search all teams & leagues, which opens it with what the visitor typed. That is the way to find a team that does not play today. If you turned Action · Search off, the search in the list works on its own and does not offer it.
Country and League menus
Plans
Country filter and League filter (in Country and league filters, in the plan column of the configurator) add a Country and a League menu next to the search field. They list only what plays in the open tab, with the number of matches and how many are live, and each menu has its own search box. Choosing a league also chooses its country, and the League menu lists the competitions of the chosen country. A chosen country or league shows as a chip with its own ×.
On phones and narrow widgets (560 px or less) the menus move into a Filters button, which opens a panel from the bottom of the widget with the countries and their competitions. The search field stays in the toolbar. Like the search dialog, the panel covers only the widget: a narrow widget in the sidebar of a desktop page does not open it across the whole page.
Leagues column
Plans
Leagues column (in the plan column of the configurator) puts the competitions beside the matches, Left or Right. In Arabic and Persian the whole layout reads from right to left, and the column swaps sides with it. Column width goes from 240 to 300 px (264 by default).
The column needs a widget at least 900 px wide. With a widget Scale above
1×, the column and that minimum grow with it (at 1.25× the column needs a
1,125 px widget). In a narrower widget it becomes
a Leagues button in the toolbar that opens the same list in a panel on
the column's side of the widget. The column stays in view while visitors scroll the matches
and scrolls on its own. If your page has a fixed header, set the CSS variable
--ls-leagues-column-sticky-top to its height so the column stops under it.
Column navigation decides what a click in the column does:
- By feed (filters the matches), the default: All matches, the featured competitions that play in the open tab, the competitions with most live matches, and every country with matches, A to Z, each with its competitions. A click filters the matches, exactly like the Country and League menus, and a chip in the toolbar shows the choice. While the column is in view it replaces the two menus. The search in the list also narrows the column.
- Full list (opens the league): every competition, with your featured competitions first, then international competitions and countries. A badge shows how many matches each one has in the open tab. A click opens the competition the way your navigation mode says: in the window over the widget, as a floating card, inside the widget (the column stays and marks the open competition) or on your own page with Dynamic Pages. With None (no entity links) nothing could open, so the column works By feed.
Turn them off
Untick Search in list (in Livescore navigation items), Country filter and League filter, or set Leagues column to Off. A filter that a visitor had chosen goes away with its switch.