How to Embed a Widget on Typedream

Typedream is a modern no-code website builder that uses a block-based editor similar to Notion. This guide walks you through embedding an Embeddy widget on your Typedream site using the Embed block and the custom code injection options.

Beginner~4 min readUpdated 2026

Prerequisites

Before you embed your widget, you need two things:

Your Embeddy embed code. Log in to your dashboard at https://embeddy.ai/dashboard, open your widget, and copy the iframe embed code. It looks like this:

<iframe
  src="https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID"
  width="100%"
  height="500"
  frameborder="0"
></iframe>

A Typedream account with an active site. You need editor access to the Typedream project where you want to embed your widget.

Embed Block

Typedream's editor works with content blocks, similar to Notion. The Embed block lets you paste a URL or iframe code directly into your page. This is the fastest way to add an Embeddy widget.

1
Open your page in the Typedream editor
Log in to Typedream and open the project and page where you want to add the widget.
2
Add an Embed block
Click where you want the widget, then type /embed to open the block menu and select Embed. Alternatively, click the + button in the editor and choose Embed from the block list.
3
Paste your embed code or URL
Paste your Embeddy iframe embed code into the Embed block. Typedream will render the iframe within the block area.
4
Resize the block if needed
Drag the handles on the Embed block to adjust its size on the page. You can also edit the height attribute in your iframe code.
5
Publish your page
Click Publish in the top-right corner to make the changes live. Visit your published site to confirm the widget renders.

Tip: If the Embed block asks for a URL instead of raw HTML, paste the full iframe src URL (e.g. https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID) directly. Typedream will create the iframe automatically.

Custom Code (Head/Body)

If you need to inject code site-wide — for example, a floating widget or analytics script — Typedream allows you to add custom code to the <head> or <body> of your site.

1
Open Site Settings
In the Typedream editor, click on your site settings (gear icon or Settings in the sidebar).
2
Navigate to Custom Code
Find the Custom Code section. You will see fields for Head Code and Body Code.
3
Paste your code into the Body Code field
For an iframe embed that should appear at a fixed position, paste your Embeddy code into the Body Code field. For scripts or meta tags, use the Head Code field.
4
Save and publish
Save your settings and publish the site. The code will be injected on every page of your site.

Important: Custom code availability

Custom code injection in Typedream may require a paid plan. If you do not see the Custom Code option in your settings, check your subscription level. The Embed block method (above) is available on all plans.

Iframe Embed Code Example

Here is what a complete Embeddy iframe embed looks like for Typedream. Copy your specific code from the Embeddy dashboard — the WIDGET_ID and PROPS_ID values will be filled in automatically.

<!-- Embeddy widget embed — paste into Typedream Embed block -->
<iframe
  src="https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID"
  width="100%"
  height="500"
  frameborder="0"
  style="border: none; border-radius: 8px;"
  loading="lazy"
  title="My Embeddy Widget"
></iframe>

You can adjust height to match your widget's content. Use width="100%" to make the embed responsive across all screen sizes.

Troubleshooting

The Embed block shows a broken preview

Some Embed blocks do not render iframe previews inside the editor. This is expected. Publish your site and check the live page to confirm the widget works correctly.

The widget shows a blank area

Verify that your Widget ID and Props ID in the embed URL are correct. Open the Embeddy dashboard and copy the embed code fresh. Also confirm your widget is published (not in draft mode) in Embeddy.

Widget is cut off or too small

Increase the height attribute in your iframe code. A common starting point is height="600". You can also drag the Embed block handles in the Typedream editor to resize it.

Custom code does not appear on the site

If you used the Custom Code (Head/Body) method, make sure you saved the settings and re-published your site. Also verify your Typedream plan supports custom code injection. Try the Embed block method as an alternative.

Frequently Asked Questions

Does embedding an Embeddy widget slow down my Typedream site?

No. Iframes load independently of your main page. The widget loads from Embeddy's servers in a separate browser thread and does not block your page's rendering. Using loading="lazy" in the iframe tag further defers loading until the widget is visible in the viewport.

Can I embed the same widget on multiple Typedream pages?

Yes — add the same Embed block with the same code on as many pages as you like. Each instance is independent. If you update the widget in the Embeddy dashboard, all embedded instances update automatically.

Can I use the Embed block on the Typedream free plan?

The Embed block is typically available on all Typedream plans, including free. However, the Custom Code injection feature (Head/Body code) may require a paid plan. Check your Typedream account settings for availability.

Ready to build your widget?

Create a free Embeddy widget — no code required. Get your embed code in minutes and drop it into your Typedream site.

Create your free widget at embeddy.ai

On this page