Tutorial

How to Share and Embed Your Typerson Form Anywhere

March 22, 20267 min read

You've built your form. Now you need to get it in front of people. Typerson gives you several ways to share and embed your forms, depending on where you want them to appear. Here's how each method works.

Direct Link Sharing

The simplest way to share your form is with a direct link. Click "Share" in the form builder and copy the link. You can paste this anywhere: emails, Slack messages, social media posts, text messages, QR codes. It opens a clean, full-screen version of your form.

The link format is typerson.com/f/your-form-slug, which looks professional and is easy to remember. You can customize the slug when you create your form to make it even cleaner.

Iframe Embed

If you want your form inside a page on your website, the iframe embed is the way to go. Click "Share," then "Embed," and copy the iframe code. Paste it into your website's HTML wherever you want the form to appear. You can adjust the width and height to fit your page layout.

This works on any website that lets you add HTML: WordPress, Squarespace, Webflow, Wix, custom sites, whatever you're using.

Popup Embed

The popup option shows your form in an overlay on top of your page. This is great for lead capture because you can trigger it with a button click. When someone clicks your CTA button, the form pops up without navigating away from the page. When they submit or close it, they're right back where they were.

Script Embed

The script embed is the lightest option. It's a small JavaScript snippet (under 5KB) that loads asynchronously and renders the form inline on your page. It adapts to the container width automatically and won't slow down your page load. This is the best option if you care about performance.

Platform-Specific Tips

  • WordPress: Use the iframe or script embed in a Custom HTML block
  • Webflow: Paste the embed code in an Embed element inside any section
  • Shopify: Add the code to a custom liquid section or a page template
  • React / Next.js: Use the iframe in a component or load the script embed in a useEffect hook
  • Notion: Share the direct link since Notion doesn't support embeds well

Choosing the Right Method

Use the direct link when you're sharing via email, chat, or social media. Use the iframe when you want the form embedded in a specific section of your page. Use the popup for lead gen CTAs where you want the form to feel integrated with your landing page. Use the script embed when you need the lightest weight option that adapts to your layout.

Build a form and put it anywhere. Start for free.

Create Your Form

typersonembedsharewebsitetutorial

Ready to create forms that convert?

Create your first form in minutes — free forever, no credit card needed.

Free forever plan · No credit card required · Setup in 2 minutes