Overview
The Search Page provides users with a central location to discover and navigate to various content types within the app, such as players, videos, articles, and games. Featuring prominent carousels and a responsive keyword-driven interface, the Search Page is accessible via the header navigation on mobile devices, offering both curated and dynamic discovery of content.
CMS Configuration
All search-related modules and behaviors are managed through the CMS, enabling full control over display, curation, and ordering:
Accessing Search Configuration
Path: App CMS > Template > Template Builder > Search Page
Configurable Elements in VL tray
Here you can configure the modules on the static search page with a search bar at the top.
Carousels and Modules
Add, remove, and arrange carousels for:
Featured Players: Static/curated player headshots with country flags.
Highlights: Curated/programmatic video thumbnails (16x9).
Upcoming Events/Games: Curated/programmatic events and thumbnails (16x9).
Define carousel titles, font styling, coloring, and backgrounds.
Thumbnails & Titles
Configure thumbnail and title assets for players (headshot + flag), videos, articles, and games.
Adjust page and module background colors.
Configurable Elements in VL standalone search
Here you can configure the modules on the static search page with a search bar at the top.
Set which categories are supported (e.g., Players, Videos, Articles, Games; others can be added).
Customize category labels.
Select horizontal layout for carousels (all categories).
Configure display limits per category per platform.
Enable or disable the "Show More" CTA per category (loads more items in the same carousel).
Set and order categories for both default landing and post-search results—results only show categories where matches are found.
End User Experience
Entry Points
The search page is accessed via the search icon in the app’s top-right header navigation.
After opening the app and landing on the homepage, users tap the search icon to reach the Search Page.
Search Page Default View
By default, users will see the landing page. Before entering any search keywords, users see:
Featured Players Carousel: Player headshots (with flags and names) for quick access.
Highlights Carousel: Video thumbnails for popular or recommended content.
Upcoming Events Carousel: Event thumbnails for soon-to-happen games/matches.
Carousels are horizontally scrollable.
Search Input and Suggestions
Tapping into the search dialog box brings up the keyboard.
As users type, text-based suggestions for all content types (players, videos, articles, games) appear below the input.
Selecting a suggestion or entering a full search term displays matching results.
Search Results Display
Results are grouped by category as defined and ordered in the CMS (e.g., Players, Videos, Articles, Games).
Each category appears only if results exist.
For each category:
Results are shown in horizontal carousels.
The "Show More" CTA appears if enabled and more items are available; clicking reveals additional results in the same carousel.
Clicking on a result navigates the user to the relevant detail page:
Player → Player Detail Page
Video → Video Detail Page
Article → Article Detail Page
Game → Game/Event Detail Page
No Results Handling
If no results are found for the entered keyword(s), users see a simple "No results" dialog.
Best Practices
Curate: Regularly update featured and highlights carousels to showcase the most compelling or timely content.
Standardize: Ensure all thumbnails use the required 16x9 aspect ratio and include appropriate player imagery with country flags.