Skip to main content

Custom code (HTML) block

What is the Custom code (HTML) block for?

Use it when there genuinely is no native block for the job. The Custom code (HTML) block is for specialised markup or less common third-party widgets. It is an advanced tool, not the default way to build pages: native blocks are easier to edit, more consistently responsive and simpler to maintain.

You can choose between two rendering modes. The section below explains when to use each one.

Inline sanitized HTML

Simple custom HTML inside the normal page flow, with scripts, iframes and unsafe event handlers removed.

Good for: a short custom structure or specialised but static HTML.

If a native block exists, use that instead. Custom HTML usually needs more maintenance and can drift away from the site's typography, responsive behaviour or accessibility patterns. Sandboxed mode is the safer starting point for code that needs its own execution environment.

What should you check before publishing?

There is no universal template for custom code, so test the real widget in the context where visitors will use it.

Mobile view

Check that the widget does not overflow, force horizontal scrolling or become difficult to use on a small screen.

Height

With Fit the height to the embed on, the frame follows its content. If you turn it off, set enough height for the important content without leaving a large empty iframe area.

Interaction

For forms, buttons, pop-ups or scripts, test the complete flow rather than only the static preview.

Native alternative

If the same need starts appearing regularly, consider replacing the workaround with a dedicated native block.

Which rendering mode should you use?

Sandboxed iframe: for third-party widgets or code that needs scripts. It runs in an isolated document and has three settings of its own:

  • Fit the height to the embed: when on, the frame grows and shrinks with its content, on phones too, so the embed does not scroll inside its own box. It is on for new blocks and off for blocks created earlier. While it is on, the number you enter is the height before the embed loads. Turn it off for an embed meant to fill a fixed box or the whole screen: one sized to the screen keeps growing. When it is off, you can set the frame height from 80 to 2000 px.
  • Name for screen readers: what the embed is, for example “Appointment calendar”. It is read out to visitors who use a screen reader, and you can write it separately for each language.
  • Loads an external service: turn it on for another company's widget (booking, chat, newsletter, player). If the site asks visitors about external content, the block waits for their consent like a map or a video.

Inline sanitized HTML: for simple static HTML. Demona removes scripts, iframes and unsafe event handlers before rendering it. This mode is as tall as its content.

In both modes, you can also adjust alignment and content width.

When is a native block better?

Long-term editability is usually more valuable than a quick workaround.

Social post →

Use the dedicated block for Facebook, Instagram, X or LinkedIn posts.

Video →

For YouTube or Vimeo, the Video block is simpler and keeps the presentation consistent.

Columns →

A custom layout often does not need HTML at all: arrange native blocks into your own composition with Columns.

ADVANCED, WHEN NEEDED

Custom HTML should be a targeted exception, not the foundation of the page.

Use it for a specialised widget or uncommon HTML, and switch to a native block when the same need becomes part of your regular content.

Build my website →Back to Website Blocks