Getting Started 4 min read 3 steps Updated 24 April 2026

How to add an Emberhop embed to any website

The Emberhop embed code is a single script tag that works on any website or CMS. This guide covers how to add it to plain HTML, WordPress, and Webflow, plus what to do if the embed does not appear.

How to add an Emberhop embed to any website

Adding an Emberhop embed to your website is a matter of copying one code snippet and pasting it into your page. The snippet works on any website that lets you edit HTML, including plain HTML files, WordPress sites, Webflow projects, and most other CMS platforms. This guide covers the most common methods.

Getting the embed code

Before you can add the embed, you need to have an uploaded and processed document in Emberhop. If you have not done that yet, see the guide on uploading your first PDF.

Once your document is ready:

  1. Open your Emberhop dashboard and click on the document you want to embed.
  2. Go to the "Embed" tab on the document settings page.
  3. Click "Copy" next to the script tag. The code is now in your clipboard.

The embed code looks like a script tag with a unique document identifier inside it. It is safe to paste into any page. It does not load any tracking scripts other than Emberhop's own viewer analytics.

Adding to a plain HTML page

Paste the script tag anywhere inside the body of your HTML file, in the location where you want the viewer to appear. The viewer will render at that position in the page flow.

<!-- Paste here where you want the Emberhop viewer -->
<script src="https://emberhop.com/embed/YOUR_DOCUMENT_ID.js" async></script>

The viewer is responsive and will fill the width of its containing element. If you want to control its size, wrap it in a div with a set width and height.

Adding to WordPress

1
Open the page or post where you want to add the embed in the WordPress block editor.
2
Add a "Custom HTML" block from the block inserter (click the + button and search for "Custom HTML").
3
Paste the Emberhop script tag into the Custom HTML block and save or publish the page.

Some WordPress page builders like Elementor and Divi have their own HTML embed widgets. The process is similar: find the HTML widget, paste the script tag, and save.

Adding to Webflow

In Webflow, use the Embed element. Drag an Embed element from the element panel onto your canvas, then paste the Emberhop script tag into the code field. Publish your site to make it live.

Important

If your website uses a Content Security Policy (CSP), the embed may be blocked by a frame-src or script-src rule. You will need to add emberhop.com to your CSP allowlist. See the troubleshooting guide on CSP issues for the exact header values to add.

After you add the embed

Once you save and publish your page, load it in a browser and check that the Emberhop viewer appears. If it loads correctly, you should see your document inside the viewer frame.

Open your Emberhop dashboard and navigate to the analytics page for that document. You should see a view recorded for your test load. If analytics are tracking, the embed is working correctly.

If the viewer does not appear, check the browser console for any JavaScript errors or network failures. The most common causes are a Content Security Policy block or an incorrect script URL. The troubleshooting articles cover both of those scenarios in detail.

← All articles