Put the calendar on your website

Before you start

Complete the diary and turn on Show free and busy to hirers. You need permission to add HTML or an embed block to your website. Your website in Diary → Settings shows a preview and your hall’s code.

Copy the calendar onto your website

1. Check How it looks on your site in the Your website panel.
2. Set Button colour if wanted and wait for Saved. Choose Copy beside the script version. If your site blocks scripts, open Your site can’t run scripts? Use the iframe version, then choose Copy beside that version.
3. In your website editor, add an HTML or embed block and paste the entire code. Use a code block, not a text or image block.
4. Preview and publish. Open the page on a phone and a computer and check the controls.
5. After changing the snippet, replace it on your website. Saved colour changes can take up to an hour to reach the site. If copying is unavailable, select the entire code and copy it manually.

Enlarge screenshot ↗

Use your own hall’s code. Script resizes automatically; an iframe may need its height adjusted in the website editor.

Close ×

Example screens: use your own hall and booking details. On a small screen, scroll within the image.

If the calendar is missing or cut off

If HallMatch’s preview works but your website does not, check whether your website plan and permissions allow scripts or iframes. Try the Iframe format if scripts are removed. The exact block names and publishing steps depend on your website builder.

Increase the block’s height or allow scrolling if the bottom is cut off. Test the published page on a phone: the request button must remain reachable. If HallMatch’s preview itself is unavailable, first check that sharing is saved and the hall is published.

What visitors can see

Only availability is shared. Turning off sharing removes free and busy times. The website block can still offer an Ask about a date button.