The Media Library holds the images for your site. Pages, the site theme, sponsors, coaches, passes, events, and add-ons use these images.
Upload images
- Open Media Library.
- Open the folder for the new images. From All images or Unfiled, uploads go to Unfiled.
- Drag images onto the Upload area, or select Choose Files.
- Check the alt text for each image. Describe what the image shows.
- Select Upload Images.
Trackside suggests alt text from the file name. Alt text is required. You can change it later.
Trackside accepts JPEG, PNG, WebP, and AVIF images up to 15 MB each. It makes smaller image sizes for pages. SVG files are not accepted.
If you upload the same image again, Media Library keeps the existing image in its folder. The message names the existing file and its alt text. No second copy appears, even if your new file has a different name. If an upload fails, the remaining files stay for another attempt.
Sort images into folders
Folders help you find images. They do not change your site.
- Select New Folder.
- Enter a Folder name and select Create Folder.
Trackside opens the new folder, so your next uploads go into it. The folder list shows how many images each folder has.
To move images, select Select Images and select each image. Then select Move to…, choose a folder in Move to, and select Move Images. To move one image, open it and change its Folder.
With a folder open, select Rename Folder to change its name. Select Delete Folder to remove it. Its images move to Unfiled. Trackside does not delete them.
Find an image
Type part of a file name or alt text in Search. Use Sort by to list images by Name, Newest, or Largest. Numbers in a name sort by value, so logo-2 comes before logo-10.
Select Tiles for large thumbnails or List for a table with each image's folder, size, and date. Your browser keeps your choice.
An image that your site uses has the label In use.
See image details
Select an image to open a larger view. Use the arrow buttons or the arrow keys to see the next image. Select Actual size to see the image at its real size.
The details show the image size in pixels, the File size, the type, the date added, and the folder. To change the alt text, edit Alt text and select Save Alt Text.
Used in lists each place that uses the image, such as the theme, a page, or a sponsor. Select a place to open it.
Choose an image for a place
Each place that shows an image has an image field. The field shows the image, its size, and how well it fits.
- Select Choose Image or Change Image.
- Read what this place needs at the top of the window.
- Select an image. The preview shows the image as it appears in this place.
- Select Use Image.
Select Cancel to keep the image you had before. Select Remove Image to clear an optional image.
Each image has a fit label: Good fit, Small, or Wrong shape. A small image can look soft. A warning does not stop you from using an image. Select Show only good fits to hide the other images.
You can also upload an image in the window. Drop the image or select Choose File, check its alt text, and select Upload Image. Trackside puts it in the open folder and selects it.
Change catalog images
Event and rental pages use the listing's Hero image. The preview shows the desktop and phone crops.
- Open Events.
- Open the listing.
- Select Edit Event.
- Choose or change Hero image.
- Select Save Event.
Saving a published listing changes its public image immediately.
Add-on images appear beside customer booking choices. An organization admin changes these images from Add-Ons.
- Open Add-Ons.
- Select Edit on the product.
- Choose or change Add-on image.
- Select Save Add-On.
Select Remove Image to clear either image. Save the editor to keep that change. Select Cancel in the editor to keep the saved image and other fields. An image you upload stays in Media Library when you cancel the editor.
Image sizes
These sizes look best. A smaller image shows a warning.
| Place | Shape | Looks best at | Warning below |
|---|---|---|---|
| Hero background, section photo | Wider than tall | 2400 px wide | 1600 px wide |
| Event or rental hero | Wider than tall | 2400 px wide | 1600 px wide |
| Add-on image | Any | 1200 px wide | 800 px wide |
| Hero phone image | Taller than wide | 1600 px tall | 1000 px tall |
| Feature tile, Image + text | Any | 1200 px wide | 800 px wide |
| Gallery image | Any | 1600 px wide | 1000 px wide |
| Pass image | Wider than tall | 1600 px wide | 1100 px wide |
| Coach photo | Taller than wide | 1000 px tall | 600 px tall |
| Logo | Wider than tall, transparent background | 600 px wide | 300 px wide |
| Favicon | Square | 512 × 512 px | 96 × 96 px |
| Social image | 1.91 times as wide as tall | 1200 × 630 px | 1200 px wide |
| Sponsor logo | Any | 400 px wide | 200 px wide |
Delete an image
You can delete an image that nothing uses. Open the image, select Delete Image, and confirm.
Trackside does not delete an image while the theme, a page, a sponsor, a coach, a pass, an event, or an add-on uses it. The saved version of a page counts too. Delete Image is unavailable for that image. Replace the image in each place under Used in first.
Someone else can remove an event or add-on image while you have its editor open. If saving reports that the image is missing, select Remove Image or choose another image. Save again. The editor keeps your other changes.