Basker Docs

IFRAME

Embed an external page, form, map, or app inside your page by its web address.

The IFRAME block embeds content from another web address — an external page, form, map, calendar, or app — directly inside your page, framed as a panel within the layout.

Use it when content already lives elsewhere on the web and you want it shown in place rather than as a link visitors must follow.

Some sites refuse to be embedded

Many sites block being shown inside another page. If the source disallows it, the block appears blank on the live site even though the address is correct. Test the address in a browser, and check with the source's provider whether embedding is allowed.

IFrame

  • IFrame URL — the full web address of the page or widget to embed. Required. Paste the address exactly as it appears in the browser, including https://.
  • Allow Fullscreen — a toggle that lets visitors expand the embedded content to fill their screen, where the embedded content offers that control. Off by default.
  • Loading Strategy — when the embedded content starts loading. Lazy waits until a visitor scrolls it into view, which keeps the rest of the page fast; Eager loads it immediately with the page. Default: Lazy.
  • Sandbox Permissions — an advanced, optional field for restricting what the embedded content is allowed to do. Leave it blank for most embeds. If you do set it, enter a space-separated list of permissions — a common starting point is allow-scripts allow-same-origin.

If an embed loads but does not behave correctly, the source's provider can tell you which sandbox permissions it needs.

Shared controls

The IFRAME block uses the standard tabs shared across blocks. On the Layout tab, Width offers Full Width, Page, or a Custom width, and Height offers Auto, Small, Medium, Large, Full, or Custom. By default the width is Page and the height is Custom, which reveals a fixed-height slider you set to match the content. This block also ships with no top or bottom margin by default, so it sits flush with the blocks around it until you add spacing yourself.

Example

Embedding an external map:

Add the IFRAME block

Add an IFRAME block where you want the map to appear.

Paste the address

Copy the map's embed address from its provider and paste it into IFrame URL.

Set the height

On the Layout tab, keep Height on Custom and set a fixed height that fits the map so it is not cut off or trailed by empty space.

Leave loading on Lazy

Keep Loading Strategy on Lazy so the map loads only when a visitor scrolls to it.

For supported ticketing providers, use the dedicated booking blocks rather than embedding the provider's widget here.

Where to go next

On this page