Skip to main content

Widget Embedding

Embed the Prediction Markets widget into your sportsbook or casino platform via an iFrame. The widget handles all UI, odds display, bet placement, and settlement — your platform provides the container and the session context.

Overview

The widget is a self-contained iFrame. Your page loads it with a session_request_id, the widget exchanges that ID for a JWT, and from that point it operates independently. Your backend only receives calls for wallet operations (withdraw, deposit, rollback).

Basic Embed

<iframe
src="https://widget.predictionmarkets.io?session_request_id=SREQ_ID&locale=en&theme=dark"
width="100%"
height="600"
frameborder="0"
allow="clipboard-write"
title="Prediction Markets"
></iframe>

Always generate a fresh session_request_id server-side before rendering the page. Never embed a reused or cached ID — the session request is single-use and expires after 1–2 minutes.

URL Parameters

ParameterRequiredDefaultDescription
session_request_idYesOne-time session token from your backend
localeNoenDisplay language: en, es, pt, fr, de
themeNolightColor theme: light or dark

The widget inherits locale from locale for market labels, date formatting, and number formatting. If omitted, the widget defaults to English.

Responsive Sizing

The widget is designed to fill its container. Set dimensions on the wrapping element rather than the iFrame itself where possible.

.predictions-widget {
position: relative;
width: 100%;
max-width: 1200px;
min-height: 400px;
border: none;
}

/* Full-height layout (sidebar panel) */
.predictions-widget--sidebar {
width: 360px;
height: 100vh;
min-height: 0;
}
<!-- Standard layout -->
<div class="predictions-widget">
<iframe
src="https://widget.predictionmarkets.io?session_request_id=SREQ_ID"
width="100%"
height="100%"
style="min-height: 400px; border: none;"
title="Prediction Markets"
></iframe>
</div>

Minimum recommended dimensions: 360px wide × 400px tall. Below these sizes some market cards may clip.

Widget URL Format

The widget base URL is provided during onboarding and is unique per operator. The format is:

https://widget.predictionmarkets.io?session_request_id=<id>[&locale=<locale>][&theme=<theme>]

Contact your account manager if you need to allowlist additional domains or configure a custom subdomain.

Branding & Customization

The widget is fully customizable to match your platform's look and feel — colors, typography, layout, and theme. Bettors see a native experience that blends with your existing sportsbook or casino UI, not a third-party embed. Branding configuration is handled during onboarding with your account manager.

Security Considerations

Content Security Policy

If your platform sets a Content-Security-Policy header, add the widget domain to frame-src:

Content-Security-Policy: frame-src https://widget.predictionmarkets.io;

Without this, browsers will block the iFrame from loading.

Session Request ID

  • Generate session_request_id on your server, not in client-side JavaScript
  • Treat it as a short-lived credential — do not log it or include it in analytics calls
  • Each page load must use a fresh ID; never reuse across sessions or tabs

Referrer Policy

Set referrerpolicy="no-referrer" on the iFrame if you do not want your platform URL sent to the widget's origin:

<iframe
src="..."
referrerpolicy="no-referrer"
title="Prediction Markets"
></iframe>

See Also