How to Embed a Widget on Cargo

Cargo is a design-focused website builder popular among creatives, designers, and artists. It offers direct access to HTML and CSS, making it straightforward to embed custom widgets. This guide covers how to embed an Embeddy widget using Cargo's in-page HTML editor and global code injection.

Beginner~5 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 Cargo account with an active site. You need editor access to the Cargo site where you want to embed your widget. Cargo 3 (the latest version) is recommended.

In-Page Custom HTML

Cargo gives you direct access to each page's HTML through its content editor. You can switch to the code view and paste raw HTML — including iframes — directly into any page. This is the most straightforward method.

1
Open the Cargo editor
Log in to your Cargo account and navigate to the page you want to edit.
2
Open the page content editor
Click on the page content area to enter editing mode. You will see a toolbar with formatting options.
3
Switch to HTML / Code view
In the editor toolbar, click the Code button (often represented by </> or labeled "HTML") to switch to the raw HTML view of the page content.
4
Paste your embed code
Place your cursor where you want the widget to appear and paste your Embeddy iframe embed code. Make sure you are in the HTML/Code view when pasting.
5
Save and publish
Save your changes. Cargo publishes changes in real time, so the widget should appear on your live site immediately.

Tip: Cargo's editor is very code-friendly. Unlike many website builders, it preserves your HTML exactly as written. You can also add inline CSS to style the iframe container.

Important: Stay in Code view when pasting

If you switch back to the visual/rich-text view before saving, Cargo may interpret or re-format your HTML. Always paste your iframe code in the Code/HTML view and save from that view.

Global Code Injection

Cargo also provides a global code injection feature for adding HTML, CSS, or JavaScript that applies to your entire site. This is useful for floating widgets, analytics scripts, or site-wide embeds.

1
Open Site Settings
In the Cargo dashboard, navigate to your site's Settings or Design panel.
2
Find the Custom HTML or Global Code section
Look for a section labeled Custom HTML, Code Injection, or Custom Code. In Cargo 3, this is typically found under Pages > Global or in the site-level settings.
3
Paste your embed code
Paste your Embeddy iframe code into the global HTML area. The code will be injected on every page of your Cargo site.
4
Save your changes
Save the settings. The code will appear on all pages of your site.

Note: If you only want the widget on a single page, use the in-page HTML method above. The global code injection adds the code to every page.

Iframe Embed Code Example

Here is what a complete Embeddy iframe embed looks like for Cargo. 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 Cargo page HTML editor -->
<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 iframe code disappears after saving

Make sure you are pasting the code in the Code/HTML view, not the visual/rich-text view. If you switch to the visual view before saving, Cargo may strip the iframe tags. Always save while in Code view.

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 wrap the iframe in a styled <div> to control its container size within Cargo's layout.

Widget does not fit the Cargo page layout

Cargo uses design-driven layouts that may constrain the width of embedded content. Try setting width="100%" on the iframe and wrapping it in a <div> with max-width set to your desired size. Cargo's CSS editor can also help fine-tune the layout.

Frequently Asked Questions

Does embedding an Embeddy widget slow down my Cargo 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.

Does Cargo support iframes on all plans?

Yes. Cargo allows custom HTML — including iframes — on all plans. Since Cargo is designed for creatives who often need custom code, there are no restrictions on embedding iframes in your page content.

Can I embed the same widget on multiple Cargo pages?

Yes — add the same iframe code to as many pages as you like using the in-page HTML method. Each instance is independent. If you update the widget in the Embeddy dashboard, all embedded instances update automatically.

Ready to build your widget?

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

Create your free widget at embeddy.ai

On this page