How to Embed a Widget on Super.so
Super.so turns your Notion pages into fast, beautiful websites. Since the content lives in Notion, embedding custom widgets requires using Super.so's custom code injection feature or Notion's native embed blocks. This guide covers both methods.
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 Super.so site connected to Notion. You need access to the Super.so dashboard for your site, as well as the linked Notion workspace.
Custom Code Snippets
Super.so allows you to inject custom HTML, CSS, and JavaScript into your site through its Custom Code feature. You can add code site-wide or to specific pages. This is the most flexible way to embed an Embeddy widget.
- 1
Open the Super.so dashboard
Log in to super.so and select the site you want to edit.
- 2
Navigate to Custom Code
In the site settings, find the Custom Code section. You will see options for Head, Body (start), and Body (end) code injection.
- 3
Paste your embed code
For a widget that appears in a fixed position on the page, paste your Embeddy iframe code into the Body (end) field. For page-specific code, use Super.so's page-level code snippet option if available.
- 4
Save and verify
Click Save and visit your live Super.so site to confirm the widget renders correctly.
Tip: Super.so also supports page-level code snippets on some plans. This lets you inject code on a specific page rather than site-wide. Check the Pages section in your Super.so dashboard for this option.
Important: Plan requirements
Custom code injection on Super.so requires a paid plan (Pro or higher). If you are on the free tier, you will need to upgrade or use the Notion embed block method below.
Notion Embed Block
Since Super.so renders your Notion pages, you can also use Notion's native Embed block to add an iframe. Super.so will render this embed on your published site.
- 1
Open your Notion page
Open the Notion page that is connected to your Super.so site.
- 2
Add an Embed block
Type
/embedand select Embed. Paste your Embeddy widget URL (thesrcvalue from the iframe code):
https://embeddy.ai/webhost/WIDGET_ID?widget_props_id=PROPS_ID
- 3
Resize the embed
Drag the edges of the Notion embed block to resize it to your desired dimensions.
- 4
Check your Super.so site
Super.so syncs with Notion automatically. Visit your Super.so site to verify the embed appears. It may take a few minutes for changes to sync.
Note: Notion embed blocks use the URL directly — not the full iframe tag. Only paste the src URL, not the entire <iframe> tag.
Iframe Embed Code Example
Here is what a complete Embeddy iframe embed looks like for Super.so's custom code injection. 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 Super.so Custom Code (Body end) --> <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 widget does not appear on my Super.so site
If you used the custom code method, verify that you saved the settings in the Super.so dashboard. If you used a Notion embed block, Super.so may take a few minutes to sync changes from Notion. Try refreshing your site or triggering a manual re-sync from the Super.so dashboard.
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.
Custom code option is not available
Custom code injection requires a Super.so Pro plan or higher. If you are on the free tier, use the Notion embed block method instead, or upgrade your Super.so plan to unlock custom code injection.
Widget is cut off or too small
Increase the height attribute in your iframe code. A common starting point is height="600". If using a Notion embed block, resize the block in Notion by dragging its edges.
Frequently Asked Questions
Does embedding an Embeddy widget slow down my Super.so 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.
Which method is better — custom code or Notion embed?
Custom code gives you full control over the HTML and placement. The Notion embed block is simpler but offers less control over sizing and positioning. For the best results, use the custom code method if your Super.so plan supports it.
Can I embed the widget on specific pages only?
Yes. If you use a Notion embed block, the widget only appears on the page where you added it. For the custom code method, Super.so offers page-level code snippets on some plans, allowing you to target specific pages instead of your entire site.
Ready to build your widget?
Create a free Embeddy widget — no code required. Get your embed code in minutes and drop it into your Super.so site.
Create your free widget at embeddy.ai