Skip to main content

Adding embedded widgets, forms, and iframes

How to get an embedded component added to your site

Updated today

Our Embed block can be added from the Page Content tab at the top left of the CMS. Just add a new block and select Embed.

The Embed block will allow any code to be pasted into it, however, embeds will often be contained in a specific HTML component, an "iframe."

Generally the provider of the embed will give you a snippet of code. You can paste that code into the Embed block sidebar.

If the code provided contains Script or Link tags, read below to see how to handle those. They generally should not be pasted into the Embed block.

*Do not paste a standard page link, which will not function. So if all you have is a page link, here are some limited instructions on setting up iframe embeds from links.

Setting the correct heights

Unfortunately, iframe components do not automatically expand to match the size of their contents, unlike other HTML elements. Therefore, if the content of the iframe overruns the iframe window, there will be a scroll bar to see the overrunning content.

If you want to remove the scrollbar by showing all the content, we allow you to set the height for the desktop, tablet, and phone versions manually so that scrolling isn't necessary. You can use the window size preview icons at the bottom of the CMS to see your site in these different views. You may also want to Publish the site, and slowly adjust the width of the window in the published site, to make sure that your iframe content isn't cut off at any screen width.

Embeds vs. Form Integrations

For any services we offer integrations for, we suggest that you use the integration versus an embed of that service. This will result in a more consistent visual appearance for your website.

Script and Link tag issues

If the code you're pasting into the Embed block contains a Script or Link (not ahref) tag, you will generally need to remove that from the rest of the embed code and paste it into the Insert Code section, and usually in the box labeled Header. You can reach the Insert Code section of an individual page by clicking Page Settings at the top left of the page. To do it site-wide, you can do it on the Site Settings page.

Script tags generally start with something like: "<script type=..."

And end with a closing tag that looks like this: "</script>"

Cut and paste everything from the opening to the closing script tag.

Link tags generally start with something like this and are self-closing: "<link..."

Did this answer your question?