WordPress is the most common place to embed a FormHug form. You can add a form to any page or post in minutes using the block editor — no plugins required.
Before You Start
Get your embed code from FormHug first: open the form → click Publish → Embed → copy the code. Keep it ready before opening WordPress.
Method 1: Custom HTML Block (Recommended)
Open the Page or Post
In your WordPress dashboard, open or create the page where the form should appear.
Add a Custom HTML Block
Click + to add a block → search for Custom HTML → select it.
Paste the Embed Code
Paste your FormHug embed code into the Custom HTML block.
Adjust the Height
Find the height attribute in the embed code and set it to match your form’s length. A short contact form typically needs 400–500px; a longer survey needs 700px or more.
Update the Page
Click Update or Publish. The form displays on the live page — the block editor shows a placeholder, not the actual form.
The WordPress editor won’t render the form inline. Open the published page in a new tab to see exactly what visitors see.
Method 2: Shortcode
If you’re using the Classic Editor or a page builder that supports shortcodes, you can use:
[formhug id="your-form-id"]
Find your form ID in the FormHug embed panel — it’s the unique identifier in your form’s URL.
Responsive Sizing
The default embed code sets the form width to 100%, which works on desktop and mobile. To cap the width on wide screens, wrap the embed in a container:
<div style="max-width: 680px; margin: 0 auto;">
<!-- paste FormHug embed code here -->
</div>
After publishing, open the live page on your phone to confirm the form renders correctly at mobile screen sizes before sharing the link.