Skip to main content

🔗 Embed forms in WordPress

This guide will show you how to embed your forms in WordPress. You can either install the official FormNX WordPress plugin (easiest - paste a form link and you're done), or paste the embed code manually into the "Gutenberg" editor, "Classic" editor, or Elementor.

Check below for steps on how you can embed your forms on a WordPress website.

The official FormNX plugin lets you drop a form into any page with just its link - no embed code, no copy-pasting scripts.

👉 Plugin & setup guide: FormNX WordPress Form Builder - Quick Start

Step-1: Download formnx.zip from the latest release on GitHub.

Step-2: In WordPress, go to Plugins → Add New → Upload Plugin, upload formnx.zip, then install and activate it.

Step-3: Open your form in FormNX, go to the Publish tab, and copy the form link.

Step-4: Edit the page or post where you want the form, add the FormNX Form block, and paste the link. That's it.

Once installed, the plugin gives you three ways to add a form:

MethodHow to use it
Gutenberg blockSearch for FormNX in the block editor - includes a live preview
Shortcode[formnx url="your-form-link"] - works in the Classic Editor and most page builders
Elementor widgetUse the native FormNX Form widget with full Elementor controls

Requirements: WordPress 6.2 or higher, PHP 7.4 or higher, and a FormNX account (the free plan works).

If you'd rather not install a plugin, you can paste the embed code directly - see the sections below.

Gutenberg Editor - Embedding forms in WordPress Gutenberg Editor​

To embed forms in Gutenberg Editor follow the below steps:

Step-1: Add or Edit the Posts or Pages where you want to add the form.

Step-2: Now below Add Title, Type / to choose a block. Now you have to choose Custom HTML block from the drop-down panel.

Gutenberg Step1

Step-3: Paste the embed code or popup/feedback button/lightbox code from FormNX of your form inside this custom HTML block.

Then, click on the Preview button to check the preview of the page.

Gutenberg Step2

Classic Editor - Embedding Forms in WordPress Classic Editor​

Follow the below steps to embed forms through the Classic Editor in WordPress:

Step-1: Install the Shortcoder plugin. There are various shortcoders available; for example, you can use this Shortcoder (https://wordpress.org/plugins/shortcoder/).

Step-2: Go to the Shortcoder tab on the left panel and click on it.

Step-3: Then click on Create Shortcode inside this tab. And you can also edit any previous embed code by clicking on the edit option.

Classic Editor1

Step-4: Enter a Shortcode name.

Step-5: Paste the embed code or Popup/Feedback Button/Lightbox code from FormNX of your form inside this block.

Step-6: Click on the Update button to update the code of the page.

Step-7: Click on the Copy button to copy the shortcode code.

Classic Editor2

Step-8: Add or edit the posts or pages where you want to add the embed form. Then click on the text option inside this tab.

Step-9: Paste the copied shortcode inside this block.

Step-10: Click on the update button to update the content of the page.

Step-11: Then, click on the Preview Changes button to check the preview of the page.

Classic Editor3

Elementor Page Builder - Embedding Forms in WordPress Elementor Page Builder​

Follow the below steps to embed forms through Elementor Page Builder in WordPress:

Step-1: Go to the post or page where you want to add the form.

Step-2: Press the ‘Edit with Elementor’ button.

Step-3: In the elements section of the Elementor, search for and select the “HTML” widget.

Elementor Steps

Step-4: Paste the embed code of your form into the HTML widget and click the “Publish” button to save your changes.

Elementor Steps

FAQs​

Do I need to install any WordPress form builder plugin for FormNX forms to work?​

No. FormNX forms work with plain embed code in any editor. The FormNX WordPress plugin is optional - it just makes embedding faster by letting you paste a form link instead of embed code.

Where do I download the FormNX WordPress plugin?​

Grab formnx.zip from the GitHub releases page, then upload it under Plugins → Add New → Upload Plugin in WordPress.

Is there a shortcode for FormNX forms?​

Yes - after installing the plugin, use [formnx url="your-form-link"] in the Classic Editor or any page builder that supports shortcodes.

Where will i see the submissions of the forms?​

You'll see all the form submissions inside FormNX List Submissions of the form.

How do I embed a form in Elementor?​

Follow the above steps of "Elementor Page Builder" to embed a form in Elementor.

Related feature: WordPress form embed