Skip to content

Embed a tournament on your own website

Live feed, bracket and results can be shown directly on your club or event website — your visitors stay on your page while the data comes live from MOEP. Technically this is an iframe: a small code snippet you paste into your website.

Two things are needed for this to work. They deliberately belong together:

WhatWhere you set itMeaning
Releaseon the individual tournamentWhether this tournament may be embedded
Allowed domainsonce for the organisationWhere it may be displayed

If either one is missing, the embedded view shows nothing. That is intentional: a tournament should never appear on an external site by accident.

Open Tournament app → Tournaments → Embed domains and enter the address of the website where the tournament should appear — for example app.eurorapidsurf.org. You can add several domains; the list applies to every tournament of your organisation, so you maintain it only once.

A few notes on the input:

  • You can leave out scheme, port and path. https://app.eurorapidsurf.org/live is shortened to app.eurorapidsurf.org when you save.
  • A leading *. allows one sub-level: *.eurorapidsurf.org covers app.eurorapidsurf.org and www.eurorapidsurf.org, but not eurorapidsurf.org itself.
  • www.yourclub.com and yourclub.com are two different addresses to a browser. If your website is reachable under both, add both.
  • Entries that do not form a valid domain are not accepted and are listed in a yellow notice after saving.

Step 2 — Release the tournament and copy the code

Section titled “Step 2 — Release the tournament and copy the code”

Open the tournament and choose “Embed on an external website” under Spectators & broadcast. Switch on “Allow embedding on external websites”. If no domain has been added yet, a yellow box points this out — complete step 1 first in that case.

Below that you configure how the embed should look:

  • Initial view — live feed, bracket or results.
  • Show switcher — the three tabs let visitors change the view themselves. Turn it off and the embed shows only the chosen view.
  • Colours — “Organisation colours” uses your club design. “Light”, “Dark” and “Automatic” use a neutral surface instead and keep only your accent colour; “Automatic” follows the visitor’s system setting.
  • Language — German or English.
  • Height — the initial height in pixels.

At the bottom you will find two code snippets to copy.

The recommended code additionally contains a small script line. It makes the frame grow with the content — for instance when switching from the live feed to the bracket. Use this one whenever your website allows custom scripts.

The code without a script is for systems that do not allow JavaScript in content. It works the same way, but the height stays fixed — set it above so the content fits, otherwise the frame gets its own scrollbar.

Paste the copied code into your website where the tournament should appear. Most content management systems offer a block called “HTML”, “Code” or “Embed” for this.

The embedded view shows bib number, first and last name, lycra colour, the individual scores, the total and who advances. Deliberately not included are the athlete photo, short biography, e-mail address, home spot and all internal identifiers — only the data needed to display the tournament is served.

The embed sets no cookies and therefore works even when browsers block third-party cookies.

A finished tournament stays visible in the embed and shows the final results; it then stops polling for updates. To remove it from the external page entirely, switch the release on the tournament back off — the snippet on your website can stay, it will show a neutral notice.

  • The area stays blank and the browser console mentions frame-ancestors: your website’s domain is not in the list from step 1. Check the spelling, especially www..
  • It says “This tournament is not released for embedding”: the switch on the tournament is off, or the tournament module is not active for your organisation.
  • Changes do not take effect immediately: release and domain list are cached for up to a minute. Wait briefly and reload the page.
  • The height does not fit: check whether the script line from the recommended code was copied along. Without it the fixed height applies.