How to Embed a Widget on Pixpa
Pixpa is an all-in-one portfolio website builder for photographers, artists, and small businesses. It offers a drag-and-drop editor with support for custom HTML blocks and site-wide code injection. This guide shows you how to embed an Embeddy widget on your Pixpa site using 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 Pixpa account with a website. You need a paid Pixpa plan to use custom code features. The HTML block and code injection are available on all paid plans.
HTML Block
Pixpa's page builder includes an HTML block (sometimes labeled "Embed" or "Custom Code") that lets you paste raw HTML directly into your page content. This is the best method for adding an Embeddy widget to a specific page.
- 1
Open the Pixpa site builder
Log in to your Pixpa account and go to Website to open the site builder. Navigate to the page where you want the widget.
- 2
Add an HTML block
Click Add Block or the + button on the page. From the block options, select "HTML", "Embed", or "Custom Code". The exact label depends on your Pixpa template version.
- 3
Paste your embed code
Click on the HTML block to open the code input. Paste your Embeddy iframe code into the field. The block accepts raw HTML including
<iframe>tags. - 4
Position the block
Drag the HTML block to the desired position on the page. You can place it between other content blocks or in a dedicated section.
- 5
Save and publish
Click Save to apply your changes, then Publish to make the page live. Visit your site to confirm the widget appears.
Tip: Pixpa's editor may show a placeholder instead of the live widget. Use the site preview or visit the published URL to verify the iframe loads and your widget displays correctly.
Important: Page types
HTML blocks work on standard pages and blog posts in Pixpa. Gallery pages have a different structure and may not support HTML blocks directly. If you need to embed a widget on a gallery page, use the site-wide code injection method described below.
Site-Wide Code Injection
Pixpa lets you inject custom code site-wide through the Settings panel. This method is ideal for widgets that should appear on every page (such as a chat widget) or for embedding on page types that do not support HTML blocks.
- 1
Open Settings
In your Pixpa dashboard, go to Settings from the left sidebar menu.
- 2
Navigate to Custom Code / Tracking Code
Look for Custom Code, Tracking Code, or External Scripts in the settings. Pixpa provides separate fields for header code and footer (body) code.
- 3
Paste your embed code
Paste your Embeddy iframe code into the Footer / Body Code field. This injects the code before the closing
</body>tag on every page of your site. - 4
Save and publish
Save your settings and publish your site. The widget will now load on every page.
Warning: Code injection adds the embed to every page on your site. If you only want the widget on a specific page, use the HTML block method instead. For floating or fixed-position widgets, code injection is the preferred approach.
Iframe Embed Code Example
Here is what a complete Embeddy iframe embed looks like for Pixpa. 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 Pixpa HTML block or Code Injection --> <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 page layout.
Troubleshooting
The HTML block is not available on my page
Some Pixpa page types (especially gallery pages) do not support HTML blocks directly. Try adding the widget to a standard page or blog post instead. For gallery pages, use the site-wide code injection method.
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 ensure your Embeddy widget is published (not in draft mode).
Widget does not render in the Pixpa editor
This is expected behavior. Pixpa's editor may show a placeholder instead of rendering the live iframe. Preview your site or visit the published URL to see the widget in action.
Widget is cut off or too small
Increase the height attribute in your iframe code. A common starting point is height="600". Also check that the HTML block section in your Pixpa template has sufficient width for the widget content.
Code injection is not working
Make sure you pasted the code into the correct field (Footer/Body code, not Header code). Also ensure you saved the settings and published your site after making changes. Clear your browser cache and reload the page.
Frequently Asked Questions
Does embedding an Embeddy widget slow down my Pixpa site?
No. Iframes load independently of your main page. The widget loads from Embeddy's servers in a separate browser context and does not block your Pixpa site's rendering. Using loading="lazy" in the iframe tag further defers loading until the widget scrolls into view.
Can I embed a widget on my Pixpa online store pages?
Pixpa's e-commerce pages have a structured layout that may not support inline HTML blocks. For store pages, use the site-wide code injection method to add a floating or fixed-position widget. Alternatively, embed the widget on a standard page and link to it from your store.
Will the widget be responsive on mobile?
Using width="100%" makes the iframe responsive within its container. Pixpa's templates are mobile-responsive by default, so the HTML block and its iframe content will adapt to smaller screen sizes 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 Pixpa site.
Create your free widget at embeddy.ai