Squad statistics widget

Description

The Squad statistics widget lets you show various team statistics during a specific season. Moreover, the widget allows you to show–and break into details– the information about each player position on the team. This is a great tool if you want to create more context about teams in your posts.

Bind the widget to HTML DOM

🚧

Make sure that you have the loader already set up on your website.
If not, follow our guide:

You can bind the widget to the HTML DOM in two ways:

  • Bind the widget without initial options. The required attribute here is "data-widgetId"
    <div data-widgetId="widget-squad-statistics"></div>
  • Bind the widget with initial options. All available options can be seen below
    <div data-widgetId="widget-squad-statistics" data-options='{...}'></div>
  • The optional "data-options" attribute:
    {
        string teamId: "97"       (Required),       // Id of the team for which the squad statistics will be displayed
        string lang: "en"         (Required),       // the language in format like: en, bg, ru and etc.
        string seasonId: "6433"   (Optional),       // Id of an ACTIVE season for which to display team player statistics, if not passed
                                                    // it will use the teams current active seasons
        obj array playerPositions (Optional): 

        Example: 
        [{"position": "forward", "columns": ["name", "birthDate", "nationality", "played", "goals", "minutes"],"columnsMobile": ["goals", "name", "birthDate"]}]

                                    // This option represents three levels of controls:
                                    // 1. The "position" controls which player type tables will be displayed
                                    //  list of available player types: "forward", "keeper", "midfielder", "defender"
                                    //  if a position different from the above mentioned is passed, a table will not be created
                                    // 2. The "columns" controls what type of columns will be presented for the given player table for desktop view.
                                    //  Also the "columns" option presents the table columns "as is", meaning that if you pass
                                    //  "columns": ["goals", "name", "birthDate"] a table will be created with the columns presented
                                    //  in the same order.
                                    //  If a column is passed that does not exist in the list of available columns, it will be ignored.
                                    //  list of available columns: "name", "birthDate", "nationality", "played", "minutes", "goals", "assists",
                                    //  "yellowCards", "redCards", "conceded", "goalsSubstitute", "minutesSubstitute", "cleansheets", "started",
                                    //  "substituteIn", "substituteOut"
                                    // 3. The "columnsMobile" controls what type of columns will be presented for the given player table in mobile view.
                                    //  Also the "columnsMobile" option presents the table columns "as is", meaning that if you pass
                                    //  "columnsMobile": ["goals", "name", "birthDate"] a table will be created with the columns presented
                                    //  in the same order.
                                    //  If a columnsMobile option is passed that does not exist in the list of available columns, it will be ignored.
                                    //  list of available columnsMobile: "name", "birthDate", "nationality", "played", "minutes", "goals", "assists",
                                    //  "yellowCards", "redCards", "conceded", "goalsSubstitute", "minutesSubstitute", "cleansheets", "started",
                                    //  "substituteIn", "substituteOut"
                                    
                                    
                                    Default columns (mobile and desktop):
                                    //  Goalkeeper: 'name', 'birthDate', 'nationality', 'played', 'cleansheets', 'conceded', 'yellow_cards', 'red_cards'
                                    //  Every other player position: 'name', 'birthDate', 'nationality', 'played', 'goals', 'assists'
                                    //  !IMPORTANT!: ON MOBILE VIEW THE COLUMNS: birthDate AND nationality ARE HIDDEN (valid for columns and columnsMobile option)!
        boolean "splitPlayersByPosition" (Optional): false - // Controls the representation of the players, if set to false the players will be splite to appropriate
                                                             // blocks (Keeper, Defender, Midfielder, Forwards) if set to true all of the player types specified in the "playerPositions"
                                                             // will be merged into a single table
        string array columns - //With this option you can control the columns when using splitPlayersByPosition: false option.
                               //With this options you can set the columns that will be displayed for all of the tables in a more general way.
                               // If columns are specified in the playerPosition they are prioritized.
                               // List of available columns: "name", "birthDate", "nationality", "played", "minutes", "goals", "assists",
                               // "yellowCards", "redCards", "conceded", "goalsSubstitute", "minutesSubstitute", "cleansheets", "started",
                               // "substituteIn", "substituteOut"
    }

Squad statistics widget in the CMS

Currently, the Sportal365 CMS offers a variety of football widgets to enable creators to add sports-specific statistics and context to their articles, videos, or galleries.

Adding the Squad statistics widget to blocky

To add the Squad statistics widget to a post (Article, Video, or Gallery):

  1. Select the + button to open the blocks menu.
  2. Then, Football widgets--> Squad statistics.
  3. Once the widget configuration panel opens, select a Team and Season in the designated boxes.

📘

Note that if you don’t select a team and season you won’t be able to continue.

  1. Select what position you want to display. You can choose between one or several player positions.
  2. In the Statistical columns: boxes, select what additional information you want to show for each position.

Video example