Skip to content
Mezdoc home
Start free

embed

Put document filling inside your product.

Not every customer should leave your app to fill a form. Embed a Mezdoc form with one iframe. It loads only on the domains you allow, and when the user is done your page gets a message with the submission id and a link to the PDF.

Start freeSee the API

Fill the embed. Watch your app get the result.

Your product with the Mezdoc form inside it, next to the messages your page receives. Submit the form and watch them arrive.

portal.example.com/certificates
Request a certificate
MezdocEmbedded
Powered by Mezdoc
Your page receives
// waiting for the user to submit
Messages arrive only from the Mezdoc origin.

A simulation in your browser. Nothing you type leaves this page.

Three steps to go live.

The dashboard gives you the iframe tag. The listener is yours: a few lines that check the origin and read the message.
  1. step 1

    Create an embed link

    Pick a template, set the link to embed, and list the sites allowed to show it. Email code, expiry and uses work the same as a hosted link.

  2. step 2

    Paste the iframe

    Drop the tag where the form belongs in your page. You choose the width and height.

    Embed the form
    <iframe
  src="https://app.mezdoc.com/embed/t/7Hq2xVb9Lw..."
  width="100%" height="800"
  style="border:0"
></iframe>
  3. step 3

    Listen for the result

    Check the origin, then read the message. Keep the submissionId: your server can fetch the PDF again any time.

    Listen for messages
    window.addEventListener("message", (event) => {
  if (event.origin !== "https://app.mezdoc.com") return;
  const msg = event.data;
  if (msg.type === "completed") {
    // msg.submissionId, msg.url (valid for an hour)
    saveCertificate(msg.submissionId, msg.url);
  }
  if (msg.type === "error") showError(msg.message);
});
    Later: fetch the PDF from your server
    curl https://api.mezdoc.com/api/v1/submissions/sub_8Kq2mR4tVx/pdf \
  -H "Authorization: Bearer sk_live_..." -o certificate.pdf

What the embed supports.

  • Only on your domainsEach embed link lists the sites allowed to show it. Browsers refuse to show the form anywhere else, and a link with no list is shown nowhere.
  • Three messages to your pageprocessing when the user submits, then completed with the submissionId and a url that works for an hour, or error with a message.
  • An email code, if you want oneThe form asks for a 6-digit code sent to the user before it opens, right inside your page.
  • The same link settingsExpiry, a limit on uses, revoking at any time, and following the live template version or a pinned one.
  • Fields, checks and signaturesMezdoc renders the fields, checks each answer before submit, and takes a drawn, typed or uploaded signature.
  • Your server hears it tooA signed submission.completed webhook reaches your backend as well, retried with backoff if your server is down.

Questions about embedding.

How does my app know the user finished?

The embed posts a message to your page. Listen for message events and check that event.origin is the Mezdoc app. A processing message arrives when the user submits, then completed with the submissionId and a download url, or error with a message.

Can I control which sites are allowed to embed?

Yes. Each embed link carries a list of allowed origins. The form only renders inside a site on that list, so your link cannot be embedded on a site you do not control.

What will my users see?

A clean form with your template's fields. It carries the Mezdoc logo and "Powered by Mezdoc", and sits in your page at the width and height you give the iframe.

Is it the same template as the API and the web form?

Yes. One template, one data model. Whether the data arrives by API, a hosted link or an embed, you get the same PDF.

Embed your first form.

One iframe, one message listener, and the finished PDF lands back in your app.
Start freeTalk to us

Free plan, no card