How to Embed a Widget on Nicepage

Nicepage is a drag-and-drop website builder available as a desktop application and an online editor. It supports WordPress, Joomla, and standalone HTML exports. This guide walks you through embedding an Embeddy widget using Nicepage's built-in HTML Element on both the desktop app and the online editor.

Beginner~5 min readUpdated 2026

On this page

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 Nicepage project. You can use either the Nicepage desktop application (Windows/Mac) or the Nicepage online editor. Both support the HTML Element feature.

Desktop App

The Nicepage desktop app provides a full-featured visual editor. The HTML Element lets you drop raw HTML — including iframes — directly onto your page layout.

  1. 1

    Open your page in the Nicepage editor

    Launch the Nicepage desktop app and open the website project. Navigate to the page where you want the widget to appear.

  2. 2

    Add an HTML Element

    Click the + (Add Element) button in the top toolbar or right-click on the page and select Add Element. From the element list, choose "HTML" or "Code". An HTML element placeholder will appear on your page.

  3. 3

    Paste your embed code

    Double-click the HTML Element to open the code editor panel. Delete any placeholder code and paste your Embeddy iframe code. The editor accepts raw HTML including <iframe> tags.

  4. 4

    Resize and position

    Drag the element to position it on the page. Use the resize handles to set the width and height. The iframe will render within the bounds of the HTML Element container.

  5. 5

    Preview and publish

    Click Preview in the top toolbar to see your page with the live widget. When satisfied, export your site or publish it to your hosting provider.

Tip: The HTML Element in the Nicepage desktop app does not render live in the editor canvas — you will see a placeholder box. Use the Preview function to verify the iframe loads correctly before publishing.

Online Editor

The Nicepage online editor works directly in your browser and follows a similar workflow to the desktop app. The HTML Element is available under the same element picker.

  1. 1

    Open the Nicepage online editor

    Log in to your Nicepage account at nicepage.com and open your website project in the online editor.

  2. 2

    Add an HTML Element

    Click + Add Element in the section where you want the widget. Scroll through the element types and select "HTML". A code input area will appear.

  3. 3

    Paste your embed code

    Click on the HTML Element to open its settings panel. Paste your Embeddy iframe code into the code field.

  4. 4

    Publish your site

    Click Publish to push your changes live. Visit your published site to confirm the widget appears and functions correctly.

Note: If you are exporting your Nicepage site as a WordPress theme, the HTML Element content will be included in the exported theme files. The iframe will work on any hosting environment that serves the exported HTML.

Iframe Embed Code Example

Here is what a complete Embeddy iframe embed looks like for Nicepage. 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 Nicepage HTML Element -->
<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 within the HTML Element container.

Troubleshooting

The widget does not appear in the editor

This is normal. The Nicepage editor shows a placeholder for HTML Elements rather than rendering them live. Use the Preview feature to see the actual iframe content. On the published site, the widget will render correctly.

The widget shows a blank area on the published site

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 check that your Embeddy widget is published (not in draft mode).

Widget is cut off or too small

Increase the height attribute in your iframe code. Also make sure the HTML Element container in Nicepage is large enough. Try height="600" or higher depending on your widget content.

The HTML Element option is not available

Make sure you are using a Nicepage version that supports the HTML Element. Update your Nicepage desktop app to the latest version or check that your online account has sufficient plan features. The HTML Element is available on all paid plans.

Frequently Asked Questions

Does the embed work when I export my Nicepage site as HTML?

Yes. When you export your Nicepage project as standalone HTML files, the iframe code inside the HTML Element is included in the exported files. The widget will work on any web server that serves the exported pages.

Can I embed the same widget on multiple pages?

Yes — add an HTML Element with the same embed code on each page. Each instance loads independently. If you update the widget in the Embeddy dashboard, all embedded instances update automatically.

Will the widget be responsive on mobile?

Using width="100%" in your iframe makes it responsive within the HTML Element container. Nicepage handles responsive layout for its elements, so the widget will adapt to different screen sizes based on how you configure the element's responsive settings.

Ready to build your widget?

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

Create your free widget at embeddy.ai