Embed on your site
Put a webinar card on your website that sends visitors to the lobby, with your campaign parameters passed along.
On this page
The embed puts a webinar card on any web page: the first slide, the title and description, and a button to join. It always shows the latest published version, so you don't need to update your site when you publish again.
Get the code
Open the webinar and go to the Embed tab. It is available once the webinar is published. The tab shows a live Preview at two widths: Wide and Phone. Next to them, pick the style: Standard or Compact (see Compact embed). Below the preview are two snippets for the chosen style.
Recommended
An iframe plus a small script. The embed fills the width you give it: a banner on wide pages, a card on narrow ones and on phones. Its height follows the content.
<iframe data-webinaric-src="https://webinaric.com/embed/webinars/YOUR_WEBINAR_ID" title="Your webinar title — webinar" width="100%" height="420" loading="lazy" style="border:0;max-width:100%"></iframe><script async src="https://webinaric.com/embed.js"></script>
Copy the snippet from the Embed tab rather than this example. It already contains your webinar's address and title.
- Several embeds on one page need the script only once.
- Embeds further down the page load when the visitor scrolls near.
- UTM parameters and ad click IDs on your page are passed on to the lobby, so the Funnel tab shows where visitors came from. See Campaign tracking.
Without script
A plain iframe, for site builders that remove scripts. It keeps a fixed height of 420px, so adjust the height to fit your layout. Your page's UTM parameters aren't passed on.
Compact embed
Just the first slide with a Join webinar · 7 min button on it, the same on wide pages and on phones. The whole slide links to the lobby. Scheduled webinars show Pick a time, and the visitor picks the time in the lobby.
Pick Compact next to the preview to get its snippets. They are the standard ones with /compact added to the address. Adding ?l=compact to the address does the same:
<iframe data-webinaric-src="https://webinaric.com/embed/webinars/YOUR_WEBINAR_ID/compact" title="Your webinar title — webinar" width="100%" height="370" loading="lazy" style="border:0;max-width:100%"></iframe><script async src="https://webinaric.com/embed.js"></script>
What visitors see
- Start now only: a Join webinar button.
- With scheduled times: Start now (when it's on) and the next few times to pick from, then a Start now or Register button. More times opens the full list in the lobby.
- Scheduled only, nothing upcoming: "No upcoming times right now. Check back later."
Joining opens the lobby in a new tab, with the chosen time preselected. The visitor enters their name and email there.
Single-page apps
If your site adds the embed after the page has loaded, for example on a client-side route change, call this after inserting the iframe:
window.Webinaric.loadEmbeds();If the embed shows at the wrong height, check that you used the Recommended snippet and that the script tag is on the page. See also the FAQ.