Embed a Bracket on Any Website
Step-by-step iframe paste guides for the six most common website platforms.
Get Your Embed URL First
- 1. Build your bracket with your team names and any scores entered.
- 2. Click Share URL on the tool. The clipboard now has your bracket URL.
- 3. The URL looks like https://tournamentbracketmaker.com/?b=eyJmIjo...
- 4. Paste that URL into the iframe src attribute on your site.
Platform-by-Platform Guides
WordPress
In the WordPress block editor, add a Custom HTML block (search "HTML" in the block inserter). Paste your iframe code into the block. Switch to the visual editor or preview to verify. Works on WordPress.com Business plans and all self-hosted WordPress sites. Free WordPress.com plans block iframe content by default - upgrade to Premium or self-host.
Squarespace
Add a Code Block (Squarespace 7.1: click the + insert point, choose Code; Squarespace 7.0: insert a Code Block from the inserter). Paste the iframe HTML. Squarespace allows iframe embeds on all paid plans. The Code Block has no editor UI, just raw HTML pasted in.
Wix
Add an HTML element via Add > Embed Code > Embed HTML. Paste the iframe. Wix wraps the embed in its own iframe container so you may need to set the inner iframe to 100% width and a fixed height. Wix free plans do not support custom HTML; you need a Combo plan or higher.
Notion
Paste the bracket URL directly into a Notion page. When Notion prompts, choose Embed. Notion will render the bracket inside its iframe container. The Notion iframe is responsive but capped at the column width of your page. Works on all Notion plans including free.
Webflow
Drag an Embed component (in the Designer, Components > Embed) onto your page. Paste the iframe HTML in the modal. Webflow supports iframes on all plans including the Starter plan. Set the parent div to a min-height that matches the iframe height.
Plain HTML
Paste the iframe tag directly into your HTML file or template. The simplest path: <iframe src="https://tournamentbracketmaker.com/?b=YOUR_ENCODED_STATE" width="100%" height="800" frameborder="0"></iframe>. For a responsive container, wrap the iframe in a div with padding-bottom: 56.25% (16:9 aspect) and position the iframe absolutely.
Recommended Dimensions
The bracket viewport supports horizontal scrolling within the iframe, so a smaller iframe still works. For embeds on a blog post column, set width to 100% and height to 700-800 pixels.