There are plenty of options in the market for CMS platforms, each with its strengths and weaknesses. Prismic CMS is one of the most popular headless content management systems available today. With Prismic CMS, itâs super easy to add new embed fields.
However, building forms isnât a built-in functionality in Prismic. And thatâs where HeyForm comes in. You can combine both the capabilities of Prismic and HeyForm to create and analyze contact forms. This guide covers how to add a contact form to Prismic CMS with HeyForm.net. Letâs dive in.
Get your HeyForm embed code.
First off, create your contact form with HeyFormâs drag and drop form builder. Then select the specific online form in your workspace and click on the share option. Here are the step-by-step instructions on creating an online form with HeyForm and sharing it with everyone.
Visit https://my.heyform.net/ and create a form.

Iâve selected a Classic Form
since Iâm going for a simple contact form.

Drag, drop, and stack HeyForm blocks to build a contact form of your choice.

Click on the share button once youâve done building the contact form.

Now youâll be greeted with HeyFormâs Share page. Find the embed section and click on the Standard embed choice.

In the next window, youâll see your embed code. Copy it to the clipboard. Weâll use it in the next step.

In my case, the embed code is:
<div class="heyform" data-heyform-id="AjIpWIPS" data-heyform-mode="0" data-heyform-button-text="Launch Form"></div><script src="<https://my.heyform.net/embed>"></script>
Youâve to make sure the AjIpWIPS
in data-heyform-id="AjIpWIPS"
reflects your specific form ID.
Embed HeyForm contact form with Prismic
Here comes the crucial step. Now that youâve got the HeyForm embed code in handy letâs add that custom embed (raw HTML code) to Prismic. HeyForm embed codes should work natively with Prisimcâs Rich text field.
Step 1: Create a Rich text field

You must configure the field to âAllow multiple paragraphsâ and set the field only to allow preformatted text.
Step 2: Embed HeyForm to your document or post type
This step is pretty much straightforward. Just paste HeyForm embed to code to the specific Rich text field youâve created.
You could also use Prismic Slices to achieve the same. Create a contact form Slice and use it anywhere as a block or section.Please refer to Prismicâs FAQ page for more clarity.