Docs | Kash

Get prediction market embeds on your website in under 5 minutes.

Step 1: Choose a Thread

First, fetch a list of available threads from our API:

cURL

curl "https://app.kash.bot/api/threads?status=active&limit=5"

You’ll get a response like this:

Response

{
  "threads": [
    {
      "id": "abc123-def456",
      "title": "2024 Election Predictions",
      "marketCount": 12,
      "totalVolume": 1250000,
      "status": "active"
    }
  ],
  "pagination": { ... }
}

Copy the id field from the thread you want to embed.

Step 2: Add the Iframe

Add this HTML to your website, replacing {threadId} with the ID from Step 1:

HTML

<iframe
  src="https://app.kash.bot/threads/{threadId}/iframe?source=your-site-name"
  width="100%"
  height="900"
  frameborder="0"
  allow="clipboard-write"
  title="Kash Prediction Markets"
  style="border: none; border-radius: 12px;"
></iframe>

Replace your-site-name in the source parameter with your actual website name. The source label shows up in embed analytics so you can see where your traffic comes from.

Step 3: Style the Container (Optional)

Wrap your iframe in a container for better responsive design:

HTML

<div class="kash-embed-container">
  <iframe
    src="https://app.kash.bot/threads/abc123/iframe?source=my-site"
    width="100%"
    height="900"
    frameborder="0"
    allow="clipboard-write"
    title="Kash Prediction Markets"
  ></iframe>
</div>

<style>
  .kash-embed-container {
    max-width: 1200px;
    margin: 2rem auto;
    padding: 0 1rem;
  }

  .kash-embed-container iframe {
    width: 100%;
    border: none;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  }

  @media (max-width: 768px) {
    .kash-embed-container iframe {
      height: 700px;
    }
  }
</style>

Step 4: Add Event Listeners (Optional)

Track user interactions with the embed:

JavaScript

window.addEventListener('message', (event) => {
  // Verify origin for security
  if (event.origin !== 'https://app.kash.bot') return;

  if (event.data.type === 'kash-iframe-ready') {
    console.log('Embed loaded successfully');
  }

  if (event.data.type === 'kash-market-clicked') {
    console.log('User clicked market:', event.data.data.marketId);
    // Track in your analytics
  }
});

Complete Example

Here’s a complete, production-ready example:

HTML

<!DOCTYPE html>
<html>
<head>
  <title>Prediction Markets</title>
  <style>
    .kash-embed-container {
      max-width: 1200px;
      margin: 2rem auto;
      padding: 0 1rem;
    }
    .kash-embed-container iframe {
      width: 100%;
      border: none;
      border-radius: 12px;
      box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    }
    @media (max-width: 768px) {
      .kash-embed-container iframe {
        height: 700px;
      }
    }
  </style>
</head>
<body>
  <div class="kash-embed-container">
    <h1>Live Prediction Markets</h1>
    <iframe
      src="https://app.kash.bot/threads/abc123/iframe?source=my-website"
      height="900"
      frameborder="0"
      allow="clipboard-write"
      title="Kash Prediction Markets"
    ></iframe>
  </div>

  <script>
    window.addEventListener('message', (event) => {
      if (event.origin !== 'https://app.kash.bot') return;

      switch(event.data.type) {
        case 'kash-iframe-ready':
          console.log('Markets loaded:', event.data.data);
          break;
        case 'kash-market-clicked':
          console.log('Market clicked:', event.data.data);
          break;
      }
    });
  </script>
</body>
</html>

Recommended Dimensions

Different embed types work best at specific dimensions:

Embed Type	Desktop	Tablet	Mobile
Thread (20-tile grid)	100% × 900px	100% × 800px	100% × 700px
Single Market	100% × 500px	100% × 500px	100% × 400px

Always use width="100%" for responsive design. Only the height needs to be fixed.

Troubleshooting

Iframe not loading?

Check the thread ID - Make sure you’re using a valid thread ID from the API
Verify the URL - The format should be exact: https://app.kash.bot/threads/{id}/iframe
Check CORS policies - Some Content Security Policies may block iframes
Test in incognito - Ad blockers sometimes interfere with embed loading

Embed looks broken on mobile?

Reduce the iframe height attribute for mobile devices using CSS media queries:

CSS

@media (max-width: 768px) {
  iframe {
    height: 700px !important;
  }
}

Organizations and partners earn a share of trading fees on trades in markets they create — embeds are a great way to drive that activity. See Kash for businesses or contact partnerships@kash.bot. The ?source= parameter is an analytics label for your embed traffic; it does not by itself set up revenue sharing.

Next Steps

API Endpoints

Explore all available API endpoints

Iframe Guide

Learn more about iframe embedding options

Examples

View React and vanilla JS examples

Overview

REST API

Webhooks

REST API SDK (TypeScript)

CLI

Protocol SDK (TypeScript)

Protocol SDK (Python)

API Error Catalogue

Public Embed API

Embed — Organization Endpoints

Embed — Partner Endpoints

Embed — Thread Endpoints

Embed — Market Endpoints

Embed — Twitter Deep Links

Embed — Guides

Embed — Code Examples

Quickstart Guide

Step 1: Choose a Thread

Step 2: Add the Iframe

Step 3: Style the Container (Optional)

Step 4: Add Event Listeners (Optional)

Complete Example

Recommended Dimensions

Troubleshooting

Iframe not loading?

Embed looks broken on mobile?

Next Steps

API Endpoints

Iframe Guide

Examples

​Step 1: Choose a Thread

​Step 2: Add the Iframe

​Step 3: Style the Container (Optional)

​Step 4: Add Event Listeners (Optional)

​Complete Example

​Recommended Dimensions

​Troubleshooting

​Iframe not loading?

​Embed looks broken on mobile?

​Interested in earning revenue share?

​Next Steps

API Endpoints

Iframe Guide

Examples

Step 1: Choose a Thread

Step 2: Add the Iframe

Step 3: Style the Container (Optional)

Step 4: Add Event Listeners (Optional)

Complete Example

Recommended Dimensions

Troubleshooting

Iframe not loading?

Embed looks broken on mobile?

Interested in earning revenue share?

Next Steps