Embed in HTML



Your embed

Downloading icon

Select a calendar and choose how tall it should be, then copy the generated HTML.

Example embed HTML

<iframe title="Availability calendar" width="1280" height="650" style="display: block; width: 100%; max-width: 1280px; height: 650px; border: 0;" src="https://dobu.uk/availability/your-nickname?no_header=&no_footer="></iframe>

Replace your-nickname with the nickname of the DoBu.uk profile you want to embed.

Preview

This example uses the richiejp profile. Select a saved profile above to preview your own calendar.

Choosing a height

The numeric width and height attributes give the browser a reliable fallback size. The inline styles make the iframe fill narrower containers without exceeding 1280 pixels.

A cross-site iframe cannot automatically resize its surrounding page as the calendar changes. Increase the height if the calendar or enquiry form is clipped; unused space may appear when its content is shorter.

Before embedding

Some website providers remove iframes or inline styles. Check the provider's documentation if the code is rejected or its layout is constrained.

WordPress users can instead use the block plugin.