Skip to main content

Embed a Form on Your Website and Style It to Match

Turn a Lumion form into an embeddable widget on your school's website — button or inline, button styling, and which domains it's allowed to load on.

A form doesn't have to live on a Lumion link. You can turn it into a widget that sits on your own website — either as a button that opens the form in a pop-up, or rendered inline as part of the page.

Who: School Admins, plus whoever edits your website · Where: Forms › open a form › the Widget tile at the top

The four tiles at the top of a form

Open any form and a status bar runs across the top:

Form Status — Draft or Published
Subdomain — whether the form is reachable at its own Lumion URL
Widget — whether the form can be embedded on your site
Embed Type — how it appears once embedded, or Not enabled

Widget and Subdomain are separate switches. A form can be embedded on your site without its Lumion link being live, or the other way round.

Turn on embedding

Click the </> icon on the Widget tile. The Enable as embeddable widget? dialog opens with everything you need to decide.

Button or inline

How should the form appear on the school's website? gives you two choices:

Button — opens the form in a modal when clicked. Good for a page where the form is one call to action among several.
Inline — renders the form in place on the page. Good for a dedicated "Apply" page where the form is the page.

Styling the button

The styling controls apply to the button, not the form itself:

Button label — leave it blank and you get the default "Apply Now" image button
Button background color
Button text color

The two colour settings only take effect once you set a button label. Leave the label blank and you keep the stock image button, and the colours are ignored — which is the most common reason a school's colours don't appear to apply.

Restrict it to your domains

On which domains should this widget be available? controls where the widget is allowed to load. Type a domain and press Enter to add it; use *.example.com to cover every subdomain.

List your school's website here. Without it, the widget will load on any site that has your embed code — which matters if the code ever ends up somewhere you didn't intend.

If you change the settings later, re-copy the code

The dialog says this plainly, and it's the part people miss:

"Changing these settings updates the embed code Lumion generates. Websites that already have this widget embedded will keep using the old code until you copy the updated embed instructions and replace the pasted code."

So a styling change is a two-step job: change it in Lumion, then replace the snippet on your website. Changing it in Lumion alone does nothing to a page that's already live.

After you submit

Widget flips to Enabled and Embed Type shows the mode you picked — for example Modal button. Three icons appear on the Widget tile: edit the widget settings, preview the form, and disable the widget.

The preview shows exactly what a visitor fills in, step by step.


What happens to submissions

Visitors complete the form without leaving your website, and submissions arrive in Lumion exactly as they would from a hosted form link — so any Customer Journey or Automation that triggers on a completed form still fires.

Related articles

Did this answer your question?