Links

Participants

Showcase your key figures: squad members, contestants, athletes and more

Description

The Participants screen is a dedicated area of the app where you can display the profiles of contestants, athletes or players. Supporting a participant image, description and the ability to categorise participants into different subsections, the Participants screen is your users' go-to place to learn more about who they're watching.

Previews

Setup Guide

Specs

Image Guidance: Exact pixel dimensions are for maximum guidance only (100 x 100px), media must be the correct ratio size to avoid being cut or distorted (0:0). For example, 16:9 is equivalent to 32 x 18px and 64 x 36px. Media must be under the recommended file weights to avoid lengthy download times (Max 500kb)
Except for Image Embed. Those images have to be exactly 400 x 400
Item
Spec
Main Participants Page/Thumbnail Image
  • Image 1:1 | 500 x 500px | Max 500kb | PNG / JPG
  • Image 4:3 | 380 x 285px | Max 500kb | PNG / JPG
Internal Header Image
  • Image 1:1 | 500 x 500px | Max 500kb | PNG / JPG
  • Image 16:9 | 750 x 498px | Max 500kb | PNG / JPG
Image Embed (inside body text)
Image 1:1 | 400 x 400px | Max 500kb | PNG / JPG

How To Embed an Image Into Participants

In order to ensure the image shows correctly please follow these steps:
  1. 1.
    Ensure any text is contained in a paragraph bracket. Starting the block of text with <p> and ending with </p> (no space between the last letter or punctuation and the closed paragraph bracket.)
  2. 2.
    Upload the image you want to use inside the Asset Library.
  3. 3.
    Start the image line with <img src="https:
  4. 4.
    Next paste the link from the Asset Library after the colon (including the //)
  5. 5.
    Then add a " then press the space bar
  6. 6.
    Then add alt"
  7. 7.
    After the quotation mark you can add the alt text. (This is used to describe the image for accessibility purposes)
  8. 8.
    Then add a " immediately after the last letter or punctuation
  9. 9.
    Then press the space bar
  10. 10.
    And end with />
An example will look like this:
Image Not Showing? If you are adding an image (or two) and one or both of the images are not showing. Trying copying the entire text into 'TextEditor', saving the document, and then copy/pasting that text back into the Main Text field.
Sometimes the quotations can be warpped and adding the text into an HTML reader, clears all formatting.