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

# Embed Buttons

> Create embeddable buttons to share your templates and projects

Create "Open in NearPlay" buttons that let users instantly open your contracts in NEAR Playground.

**Use cases:**

* **GitHub READMEs** - Let users try your contract without cloning the repo
* **Documentation** - Add interactive examples to your tutorials
* **Blog posts** - Embed runnable code samples in your articles
* **Learning resources** - Provide instant access to example contracts
* **Project showcases** - Let visitors explore your smart contracts live

## My Embeds

The Embeds page displays all your created embed buttons in a table:

| Column      | Description                            |
| ----------- | -------------------------------------- |
| **Name**    | Embed name                             |
| **Type**    | Source type badge (github or project)  |
| **Clicks**  | Number of times the button was clicked |
| **Views**   | Number of times the button was viewed  |
| **Created** | When the embed was created             |
| **Actions** | Copy code, Preview, or Delete          |

<Frame>
  <img src="https://mintcdn.com/nearplay/hkzsqd_V1LyMjkBt/images/guides/embeds-table.png?fit=max&auto=format&n=hkzsqd_V1LyMjkBt&q=85&s=2943f806ecb99cb40c2a4faeac99ba20" alt="My Embeds" width="4100" height="2408" data-path="images/guides/embeds-table.png" />
</Frame>

## Creating an Embed

Click the **Create Embed** button to open the creation modal. You can create embeds from three sources:

### From Template

Create an embed for a template in the marketplace:

1. Go to the **Embeds** page
2. Click **Create Embed**
3. Select the **Template** tab
4. Choose a template from the dropdown
5. Customize the button text and style
6. Preview the button appearance
7. Copy the embed code
8. Click **Create Embed**

<Frame>
  <img src="https://mintcdn.com/nearplay/hkzsqd_V1LyMjkBt/images/guides/embed-from-template.png?fit=max&auto=format&n=hkzsqd_V1LyMjkBt&q=85&s=8084023d30837d151d2f8d75f0cdcff7" alt="Embed from template" width="4100" height="2408" data-path="images/guides/embed-from-template.png" />
</Frame>

### From Project

Create an embed for one of your projects:

1. Go to the **Embeds** page
2. Click **Create Embed**
3. Select the **Project** tab
4. Choose your project from the dropdown
5. Customize and copy the embed code
6. Click **Create Embed**

<Frame>
  <img src="https://mintcdn.com/nearplay/hkzsqd_V1LyMjkBt/images/guides/embed-from-project.png?fit=max&auto=format&n=hkzsqd_V1LyMjkBt&q=85&s=0ee77c9226d75395fcf22c4e450541a8" alt="Embed from project" width="4100" height="2408" data-path="images/guides/embed-from-project.png" />
</Frame>

### From GitHub

Create an embed directly from a GitHub repository:

1. Go to the **Embeds** page
2. Click **Create Embed**
3. Select the **GitHub** tab
4. Enter the repository URL (e.g., `https://github.com/owner/repo`)
5. Customize and copy the embed code
6. Click **Create Embed**

<Frame>
  <img src="https://mintcdn.com/nearplay/hkzsqd_V1LyMjkBt/images/guides/embed-from-github.png?fit=max&auto=format&n=hkzsqd_V1LyMjkBt&q=85&s=acfe91a4d709eb3c4865dffbc9a17ec9" alt="Embed from GitHub" width="4100" height="2408" data-path="images/guides/embed-from-github.png" />
</Frame>

## Customization Options

| Option          | Description                                                       |
| --------------- | ----------------------------------------------------------------- |
| **Button Text** | Custom text displayed on the button (default: "Open in NearPlay") |
| **Style**       | Button appearance style (Outline, Filled, etc.)                   |

## Embed Code Formats

The embed code is available in three formats:

| Format            | Best For                           |
| ----------------- | ---------------------------------- |
| **HTML (Image)**  | Shield.io badge - works everywhere |
| **HTML (Button)** | Styled HTML button                 |
| **Markdown**      | GitHub READMEs and documentation   |

## Tracking

Each embed tracks clicks and views automatically. View statistics in the My Embeds table to see how your embeds are performing.
