Two minutes on any platform

Embedding a widget on your site

Every widget has one embed code: an iframe that draws the widget, and a few lines of script that keep the iframe exactly as tall as the widget and let a video play over the page. Paste both where the widget should appear. The code never changes, so publishing a new look in DreamWidget updates every site that carries it.

The code

1. Copy it. In the editor, press Publish changes; the window that says Your widget is live has the code and a Copy code button, with steps for your website builder. The same code is in the editor's Settings, under Copy embed code, and on the dashboard every widget's card has Copy embed.
2. Paste it whole. Both parts, the iframe and the script that follows it. A platform that strips the script still shows the widget, but its height will be a fixed guess and a video will play inside the widget rather than over the page.

<iframe id="gfw-…" src="https://cdn.dreamwidget.com/embed/logos.html?w=…" …></iframe>
<script>…</script>

WordPress

Block editor (Gutenberg): add a block, search Custom HTML, paste the code, and update the page. Preview shows the widget. Classic editor: switch the editor to the Text tab (not Visual), paste, and update. Elementor, Divi, Beaver Builder: each has an HTML widget or module; paste there. WordPress.com: the Custom HTML block is on the Business plan and above; the free plans do not allow scripts.

Wix

In the editor click Add elements (the plus), then Embed code, then Embed HTML. An element appears; click Enter code, choose Code, paste, and Update. Drag the element's edges to the width you want, and set its height a little taller than the widget: Wix embeds are fixed boxes, and the widget sits inside. Wix Studio: Add, Embed & Social, Embed HTML, the same from there.

Squarespace

Edit the page, click Add block where the widget goes, choose Code, paste, make sure Display source is off, and save. Code blocks with scripts need the Business plan or above; the Personal plan strips scripts.

Webflow

Drag an Embed element (under Components, or type Embed in the add panel) to where the widget goes, paste, save, and publish the site. Webflow's designer canvas shows a placeholder; the widget draws on the published site and in preview.

Shopify

In the theme editor, add a section or block of type Custom Liquid where the widget goes and paste the code into it. For a page rather than the theme, open the page in the admin, click the <> button in the content editor to show HTML, and paste. Save.

Putting a video wall on a Shopify store specifically? Our YouTube gallery for Shopify walks through that one case with the theme settings named.

Framer

Insert an Embed component, set its type to HTML, paste, and give it the width of your layout. Framer sizes embeds itself; set the height a little taller than the widget.

Carrd

Add an Embed element, set Type to Code, paste, done. Embeds need Carrd's Pro Standard plan or above.

Plain HTML, or anything else

Paste the code into the page's HTML where the widget goes. It works in any HTML page, in a static site generator, in a React or Vue app's markup, and in a CMS with an HTML field. It needs nothing installed.

Checking it worked

1. The widget fills the space you give it. It draws at the width of whatever box it sits in, and its height fits the content with no scrollbar and no empty band beneath. If there is a fixed 400px box with a scrollbar, the script part was stripped: try the platform's HTML or code block rather than a rich text field.
2. A video opens over the page and plays at once. If it opens inside the widget's box instead, the script was stripped; the widget still works, smaller.
3. Your changes reach the site on their own. Anything you edit here and publish appears within a minute, with a hard refresh. Nothing on the site needs to change.

Anything else, email hello@dreamwidget.com with the page's address and we will look at it on the page itself.