> ## Documentation Index
> Fetch the complete documentation index at: https://sportsindex.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Embeds & Media

> Add live content from any platform to your layout

One of the most powerful features of the collection editor is the ability to embed live content from across the internet directly into your layout. Paste a URL from Twitter, YouTube, Instagram, TikTok, or dozens of other platforms, and it renders right on the canvas.

## Embed Blocks

The **Embed** block is the simplest way to add external content.

<Steps>
  <Step title="Add an Embed block">
    Drag the **Embed** block from the Media section of the sidebar onto your canvas.
  </Step>

  <Step title="Paste a URL">
    Double-click the block and paste the URL of the content you want to embed.
  </Step>

  <Step title="Watch it render">
    Sports Index automatically resolves the URL and renders the content live on the canvas. For supported platforms, you get a fully interactive embed (playable videos, expandable tweets, etc.).
  </Step>
</Steps>

<Callout type="tip">
  You can embed content from any publicly accessible URL. If the platform is not directly supported, Sports Index will pull the page's title, description, and thumbnail using its metadata to create a link card.
</Callout>

## Supported Platforms

Embeds work best with these platforms:

| Platform          | What renders                                                   |
| ----------------- | -------------------------------------------------------------- |
| **Twitter / X**   | Full tweet embed with text, images, and engagement counts      |
| **YouTube**       | Playable video player                                          |
| **Instagram**     | Post embed with image/video and caption                        |
| **TikTok**        | Video player embed                                             |
| **ESPN**          | Article card with headline and thumbnail                       |
| **Substack**      | Article card with title, author, and preview                   |
| **Spotify**       | Playable audio embed (episodes, tracks, playlists)             |
| **Reddit**        | Post card with title and content preview                       |
| **Any other URL** | Link card with title, description, and thumbnail from metadata |

## Post Blocks

The **Post** block lets you embed a specific item from your library. This is useful when you have already imported content and want to feature it in a collection.

<Steps>
  <Step title="Add a Post block">
    Drag the **Post** block from the Media section onto your canvas.
  </Step>

  <Step title="Select from your library">
    Double-click the block to open a picker that shows your imported library items. Search or scroll to find the one you want.
  </Step>

  <Step title="The post renders inline">
    The selected post appears on the canvas with its platform-native embed, thumbnail, title, and author information.
  </Step>
</Steps>

## Post Galleries

A **Post Gallery** is like a folder of posts displayed as a thumbnail grid. It is perfect for grouping related content -- for example, all the highlights from a single game or a season's worth of interviews.

<Steps>
  <Step title="Add a Post Gallery block">
    Drag the **Post Gallery** block from the Media section. It spans 2 or 3 columns to give the thumbnails room to breathe.
  </Step>

  <Step title="Add posts to the gallery">
    Double-click the block to open the gallery editor. From there, you can add posts from your library one at a time. Each post appears as a thumbnail in the grid.
  </Step>

  <Step title="Give it a title">
    Add a title to describe the gallery -- something like "2025 Season Highlights" or "Best Interviews."
  </Step>
</Steps>

<Callout type="note">
  Post galleries display as a compact thumbnail grid on your published page. Visitors can click any thumbnail to expand and view the full embedded content.
</Callout>

## Image Uploads

The **Image** block lets you upload your own images or paste an image URL.

* **Supported formats:** JPG, PNG, GIF, and WebP
* **Maximum file size:** 5 MB
* **How to use:** Drag an Image block onto the canvas, then double-click to upload a file or paste a URL.

<Callout type="warning">
  Images larger than 5 MB will be rejected. If your image is too large, try compressing it or reducing its dimensions before uploading. Most screenshots and web images are well under this limit.
</Callout>

## Tips for Working with Media

* **Mix and match** -- A single collection can include embeds from multiple platforms. Put a YouTube video next to an Instagram post next to a tweet. It all works together.
* **Use Post blocks for library items** -- If you have already imported content into your library, use the Post block instead of Embed. It links the block to your library item so everything stays connected.
* **Gallery for volume** -- When you have more than 3-4 pieces of media to show, a Post Gallery keeps things organized without taking up too much vertical space.
* **Embed for quick adds** -- If you just want to drop in a single URL without importing it to your library first, the Embed block is the fastest path.
