By Editorial Staff | Reviewed by Syed Balkhi | October 25, 2024 | Reader Disclosure
Forms on WordPress play a crucial role in engaging with your audience and expanding your reach. Whether you’re looking to integrate a contact form, a survey, or a feedback form, placing it on your website is a straightforward method to gather visitors’ information.
We utilize forms across all our initiatives, ranging from contact pages to newsletter opt-ins and even checkout processes. Throughout this journey, we’ve acquired the knowledge needed to successfully embed a WordPress form, and we are excited to guide you through the complete procedure from beginning to end.
This guide will demonstrate how to embed forms using the leading WordPress form builders available.
A WordPress form serves as an essential instrument for gathering important information and insights from your website visitors. It enables users to enter their personal details, including their name, email address, and feedback.
There are various applications for forms. For instance, you can set up a contact form to facilitate user communication or create a survey to collect opinions, as well as a registration form for upcoming events.
Additionally, forms can be utilized for scheduling appointments or receiving donations. Many businesses also leverage forms to manage customer support inquiries.
Without the integration of forms, you may overlook valuable opportunities to interact with your visitors. Therefore, incorporating forms into your WordPress site is a wise strategy for any site administrator.
In the following sections, we will guide you through each step necessary to integrate forms into your WordPress site. If you have a specific form type in mind, you can follow the relevant segment of the article:
Are you ready? Let’s dive in.
WPForms is regarded as the leading multipurpose form builder available today. It is also among the most widely utilized, boasting over 6 million active users.
This tool offers more than 2000 customizable templates that are ready to use, enabling you to create any form you envision.
In addition to contact forms, WPForms allows you to effortlessly create a range of forms, from simple ones to more complex designs.
For embedding WPForms, you have the option of using a WPForms block or a shortcode.
Let’s go ahead and install and activate WPForms and explore this process together. If you require assistance, you can refer to our guide on how to install a WordPress plugin.
After that, follow our comprehensive guide on how to create a contact form in WordPress.
Integrating WPForms Using the WPForms Block
When your form is prepared for publication, simply hit the ‘Embed’ button within the form builder to incorporate the form onto your webpage with a WPForms block.
This action will bring up a popup where you can opt for an already existing page or set up a new page for the form.
By selecting the ‘Select Existing Page’ option, you’ll encounter a dropdown listing all the pages available on your site. If you choose ‘Create New Page,’ a field will appear prompting you to ‘Name Your Page.’
After selecting or naming your new page, proceed by clicking the ‘Let’s Go!’ button.
You will then be taken to the page’s block editor.
At this point, you can click the ‘+’ button and look for the WPForms block.
The following step involves opening the dropdown in the WPForms block to select the form you wish to embed.
Once you choose a form, WPForms will display it within the block editor.
Next, you may want to explore the ‘Form Settings’ located in the panel on the right.
By default, WPForms does not display your form title. Therefore, you might consider enabling the ‘Form Title’ option to include the title and provide visitors with additional context. If you create a form description, you can also activate that option.
Moreover, you have the ability to style your form with a theme to ensure it aligns with the overall aesthetic of your site.
Once you are satisfied with the appearance of the form, simply click the ‘Save’ button.
This is the process for embedding WPForms utilizing a WPForms block.
Embedding WPForms Using a Shortcode
An alternative method to embed WPForms is through the use of a shortcode.
To begin, navigate to WPForms » All Forms to locate the ‘Shortcode’ column associated with each form.
Next, you need to copy the shortcode for the specific form you wish to embed. For instance, let’s take the shortcode from our ‘Customer Review’ form.
The following step is to access the page or post where you plan to include the form. You can do this by selecting ‘Pages’ or ‘Posts.’ Hover over your chosen item and click ‘Edit’ when it appears.
This action will take you to the editor for that page or post.
To include the form, start by clicking the ‘+’ button and look for the ‘Shortcode’ block.
After adding the block, you can insert your WPForms form’s shortcode in the provided text field.
This is an example of how it might appear:
Keep in mind that the block editor does not display the form in the live editing view.
First, make sure to save the changes, then click the ‘View Page’ button when it shows up in the bottom left corner.
Incorporating a donation form into your website allows individuals to easily support your cause. When visitors encounter a straightforward and evident method to contribute, they are more inclined to donate.
The simplest way to add donation forms in WordPress is by utilizing the Charitable plugin. This widely used tool enables you to create and tailor various fundraising campaigns with over 100 pre-designed templates.
Let’s proceed to install and activate Charitable for your donation form. If you require assistance, you can refer to our guide on how to install a WordPress plugin.
Once you’ve activated the plugin, navigate to Charitable » Settings to input your Pro license. Just enter your license key and hit ‘Verify Key’ to start the process.
With this step complete, you can proceed to design your donation form. For comprehensive guidance, you may refer to our detailed instructions on how to create a recurring donation form in WordPress.
After finalizing the appearance of your form, you can place it within a WordPress post or page.
In the campaign builder, begin by selecting the ‘Draft’ dropdown to view its options. Next, click on ‘Publish,’ and Charitable will automatically generate a new page for your campaign.
Congratulations! You’ve successfully set up and launched your first Charitable campaign.
When you check your website now, you’ll be able to view your donation form working perfectly.
You may also spot the ‘Embed Wizard’ link in the pop-up window, as well as the ‘Embed’ button located within the Charitable editor.
These features allow you to integrate your donation form into additional posts or pages seamlessly.
To get started, just click on the ‘Embed Wizard’ link or the ‘Embed’ button to open the embed prompt.
A popup will appear, prompting you to either pick an existing page or create a new one.
As we already have a specific donation form page, it’s advisable to select ‘Select existing page.’ Please click the button to proceed.
Next, a dropdown menu will display all the pages available on your WordPress site.
You have the option to open the dropdown menu, select a page, and press the ‘Let’s Go’ button.
This action will take you to the block editor for that page.
Once there, you can click on the ‘+’ button and look for the ‘Charitable Campaign’ block. Just click on the result from your search to include it in the content editor.
Following that, you’ll be able to select a donation form to embed from the dropdown menu of the ‘Charitable Campaign’ block.
First, open the dropdown menu to reveal your options. Next, select the campaign you wish to incorporate.
If the preview isn’t visible in the content editor, there’s no need to be concerned; the block functions correctly.
Now, click on the ‘Save,’ ‘Update,’ or ‘Publish’ button to activate your changes.
You’re all set! Visit the page to witness the donation form operating:
HubSpot is an excellent platform for expanding your business, offering tools such as a customer relationship management system (CRM) that allows you to keep track of customer information, a website builder, and many other features.
One fantastic aspect is its form builder, which integrates seamlessly with WordPress. When a user submits a form, their information is directly sent to HubSpot CRM, making it easy for you to follow up with them through emails and messages.
Additionally, you can link HubSpot with other form tools, including WPForms. This integration enhances the platform’s utility as it is compatible with a range of tools you may already be utilizing.
In this guide, we will demonstrate how to incorporate HubSpot forms using the HubSpot Form Builder plugin along with the WPForms’ HubSpot Addon.
Integrating HubSpot Forms Through the HubSpot Plugin
To integrate HubSpot Forms using the plugin, the first step is to install the HubSpot plugin. If you require assistance, you can refer to our tutorial on how to install a WordPress plugin.
After activating the plugin, navigate to the ‘HubSpot’ section in your WordPress dashboard. Here, you’ll discover various methods to link your website with HubSpot:
Once you’ve either signed into or created a HubSpot account, you will be prompted to connect it to your WordPress site.
Just click the button to link your website, and HubSpot will begin the connection process.
After the connection is established, you’ll be all set to design your HubSpot form with the HubSpot plugin.
Proceed to the section labeled HubSpot » Forms. Next, you can select the option to create a form.
At this point, you can pick a type of form and a template. You will then be taken to a new tab where you can utilize the form builder to tailor your HubSpot form to your needs.
For comprehensive instructions, you can refer to the initial method outlined in our guide on how to create a HubSpot form in WordPress.
Once you are satisfied with the appearance of your form, the following step is to integrate it into your website. Naturally, you should utilize the ‘Embed’ option found within the form builder.
However, this approach can be somewhat perplexing.
It only allows you to share the form link and implement an HTML snippet within your WordPress post or page.
Alternatively, you can click the ‘Back to WordPress’ button to embed your forms directly from the HubSpot dashboard within your admin area.
Feel free to click the button located in the top left corner.
Next, hover over the form you wish to embed.
Then, just click the ‘Embed’ button once it shows up.
You will encounter a pop-up window displaying various methods to integrate your form through HubSpot.
In this section, you can opt to incorporate your HubSpot form into a post or page by utilizing the HubSpot block. Additionally, if you navigate to the other tab, you will discover the shortcode for the form.
For the purposes of this tutorial, we will select the ‘WordPress Post’ option.
This action will redirect you to the ‘Posts’ page in a new tab. Feel free to access a post for embedding the form by hovering over a post and selecting ‘Edit’ when it appears.
Next, you can incorporate the HubSpot Form block into your page using the content editor.
To do this, click the ‘+’ icon and utilize the search feature to find the HubSpot Form block. When you locate it, simply click to select it.
This action will place the HubSpot Form block into the content section.
Now, let’s open the dropdown menu to explore the options. From there, you can select the HubSpot form you wish to embed.
And that’s it! You can now click the ‘Save’ button to store your changes.
Here’s how it appears on our demo site:
Integrating HubSpot Forms with the WPForms’ HubSpot Addon
Utilizing WPForms to design a HubSpot form provides a simpler and more effective method for handling forms and contacts, eliminating the need to manage several plugins simultaneously.
WPForms allows you to create forms and seamlessly integrate with HubSpot in a unified platform. This streamlines the experience, granting you access to WPForms’ intuitive drag-and-drop builder and various templates while ensuring your form data syncs with HubSpot automatically.
Note: To utilize the HubSpot Addon in WPForms, you will require the Elite plan. This plan includes the HubSpot addon along with all features found in the Pro plan, enabling you to use the plugin across unlimited WordPress sites and receive premium support. This makes it an excellent choice if you operate a marketing agency.
The first step is to install and activate the WPForms plugin. You can refer to our in-depth guide on how to install a WordPress plugin.
After activation, you will need to confirm your license key in WPForms » Settings.
You can locate your license key within your WPForms account. Click on the clipboard icon to copy it. After that, return to your WordPress tab to enter it into the ‘License Key’ field.
Next, click the ‘Verify Key’ button to activate your plan.
Now, navigate to WPForms » Addons in the admin dashboard to proceed with the installation of the HubSpot Addon.
Scroll down to find the HubSpot add-on, and then click on the ‘Install Addon’ button to continue.
Upon activating the addon, navigate to the WPForms ‘Settings’ panel within your WordPress dashboard, then proceed to the ‘Integration’ tab.
In this section, you can link your HubSpot CRM account with WPForms. Just click on ‘+ Add New Account’ and provide your account information.
After connecting your account, it’s time to design and embed a HubSpot form using WPForms.
To begin, create your form by going to WPForms » Add New. On the following screen, name your form and choose a form template to get started.
After that, you can modify the template utilizing the form builder.
If everything appears satisfactory, feel free to navigate to the ‘Marketing’ panel. From this section, let’s select the ‘HubSpot’ option to link the form with the platform.
Next, enter your HubSpot account information and follow the setup instructions.
Once completed, you can publish the form using the WPForms block or the form’s shortcode. For further information, you may refer to our guide on how to create a HubSpot form in WordPress.
WPForms and various other WordPress form builders are quite user-friendly. They integrate seamlessly with your WordPress site, allowing you to perform numerous tasks such as designing forms for payments, crafting login forms, and creating personalized user registration forms, among other functionalities.
However, there might be instances where you need to distribute a form across different websites or platforms.
In such situations, Google Forms can prove to be very useful. They are simple to share, function effectively on mobile devices, and consolidate all responses in one central location. Moreover, you can invite collaborators to assist with managing the responses, all of which are saved in Google Drive.
To incorporate a Google Form into WordPress, you should begin by crafting a form on the Google Forms website. Just click the ‘Go To Forms’ button to get started.
In the following screen, you’ll encounter a selection of form templates. Feel free to select any of them to begin your creation process.
If you prefer, you can initiate a completely new form by selecting the option labeled ‘Blank form.’
After picking a template, you can start tailoring the form to your needs. Here are some actions you may consider:
Additionally, you have the option to utilize AI tools to determine the most appropriate fields for your inquiries.
Once you are satisfied with the appearance of the form, you can proceed by clicking the ‘Send’ button. This action will trigger a pop-up window that allows you to obtain the embed code for the form.
After you have copied the embed code, navigate to the WordPress page or post where you wish to showcase the form.
In the post or page’s content editor, click on the ‘+’ button and look for the ‘Custom HTML’ block. Select it to include it within your page.
Now, simply paste the copied embed code from Google Forms into the Custom HTML block.
Once you’ve completed the steps, be sure to click the ‘Update’ or ‘Publish’ button. After that, when you check your website, you should see the Google form functioning properly.
For a more comprehensive set of instructions, you can consult our guide on how to embed a Google form in WordPress.
Zoho Forms is an excellent tool that allows you to create all types of forms effortlessly. Whether you’re looking for a contact form, survey, registration form, or order form, Zoho Forms can meet your needs.
Additionally, integrating a Zoho Form into your WordPress site is straightforward. However, before we get to that process, let’s begin by creating the form.
To begin, you’ll want to set up an account on the Zoho Forms platform. Just click on the option to sign up for free.
After your account is created, you can start building your form.
The first step is to select the ‘New Form’ option within the form builder.
Next, you’ll discover that Zoho Forms provides three different methods for form creation:
In this guide, our selection will be the ‘Website Feedback’ template.
Next, let’s proceed by clicking on the ‘Use this template’ button.
Once you do that, you will be taken to the Zoho Forms form builder.
The customization options can be found on the left panel, while the form preview appears on the right. You can easily add elements to your form by dragging and dropping them.
Zoho Forms allows you to customize the form’s theme so that it aligns with the design of your website.
To achieve this, navigate to the ‘Themes’ section. From there, just hover over your desired theme and select ‘Apply.’
If you’re satisfied with the appearance, you can move on to the ‘Share’ section.
This section offers numerous options for embedding your forms.
To start the process of embedding it into a WordPress site, first, navigate to Embed » Website Builders. Once there, click on the ‘Go to WordPress’ button.
You will be taken to the Zoho Forms page located within the WordPress plugin directory.
Next, simply install the plugin. If you require assistance, feel free to check our guide on how to install a WordPress plugin.
After activating the plugin, you can open the post or page where you wish to embed Zoho Forms. Then, click the ‘+’ button and choose the Zoho Forms block.
After adding the block, you can select the button to access Zoho Forms.
Additionally, there is an option to embed using a permalink, but this approach is not recommended for beginners.
Next, you will be asked to select the domain associated with your Zoho account.
For this instance, we will opt for ‘zoho.com
’ from the dropdown list and proceed by clicking ‘Connect.’
Following that, you will have the opportunity to select the form you’d like to integrate.
Just click on the dropdown menu and pick your preferred option from the list provided. After that, make sure to scroll down and press the ‘Embed’ button.
Your content editor will subsequently display your Zoho form.
If you’re satisfied with the appearance, feel free to click the ‘Save’ button.
Now, when you access the page, you will see your Zoho form in action.
Here’s how it might appear:
From the visual above, it is evident that the Zoho Forms theme facilitates aligning the form with your website design.
While not a conventional form builder, OptinMonster is an excellent resource for generating user sign-up forms and building an email list.
At WPBeginner, we have experienced outstanding outcomes with this lead-generation tool. For instance, by utilizing OptinMonster, we managed to boost our email subscribers by an impressive 600%.
When setting up email sign-up forms, various campaign types can be employed, like slide-ins and lightbox pop-ups. Before we delve into the process of embedding the OptinMonster email sign-up form, it’s essential to ensure that the form is properly prepared.
First, you will need to create an OptinMonster account by visiting their website and clicking the appropriate button to get started.
This action will direct you to the pricing details.
We suggest considering the Pro plan as it is favored among users and features the ‘Exit Intent’ functionality. Additionally, you can benefit from our exclusive WPBeginner OptinMonster coupon code for a discount.
Once you have selected your plan, complete your transaction by entering your payment information and continuing with the checkout process.
After that, it’s time to install and activate the OptinMonster WordPress plugin. For assistance, refer to our detailed guide on how to install a WordPress plugin.
This plugin establishes a connection between your WordPress site and OptinMonster. To get started, navigate to OptinMonster » Settings in your WordPress admin dashboard. Next, select the option to ‘Connect Your Existing Account.’
Once you are connected, you can begin creating your OptinMonster email sign-up form. For comprehensive guidance, you may refer to our guide on how to construct your email list in WordPress using OptinMonster.
OptinMonster offers detailed display rules that enable you to present the appropriate campaign to the right audience at the optimal time, ultimately enhancing conversion rates. These settings can be located under Display Rules in the campaign builder.
In this section, you have the flexibility to determine the timing and locations of your campaigns based on user behavior.
Additionally, you can tailor campaigns for various audiences, such as configuring different layouts for mobile and desktop users.
OptinMonster provides the ability to configure rules based on particular days or locations, enabling you to launch focused campaigns such as Black Friday promotions or seasonal popups tailored for various countries.
Moreover, OptinMonster’s exit-intent technology assists in retaining visitors who are on the verge of leaving your site. This feature monitors user activity and activates a targeted message right before they depart, which helps in capturing more email subscribers and boosting conversions.
Once you are satisfied with your settings, it’s time to incorporate the lead generation form into your website.
All you need to do is click the ‘Save’ button in the builder to start the process.
Once you have confirmed that all your changes are saved, you can proceed to the ‘Publish’ tab.
Here, you will need to alter the status from ‘Draft’ to ‘Publish.’ After doing so, you will notice that the ‘Publish’ tab now indicates ‘Published,’ and the pause icon has been replaced with a check mark.
At this point, you can exit the campaign editor and go to OptinMonster » Campaigns.
The following step is to modify the status from ‘Pending’ to ‘Publish’ for your email sign-up pop-up. Click on the ‘Pending’ link to access the dropdown menu and choose the ‘Publish’ option.
There you have it!
Now, if you visit your website, you’ll see the email sign-up popup in action.
If your goal is to sell just one product or if you prefer not to establish a complete shopping cart, using extensive eCommerce plugins like Easy Digital Downloads or WooCommerce may be excessive. In many cases, creating a straightforward payment form is a more efficient solution for processing custom amounts or offering a limited range of items.
This is where WP Simple Pay can assist you.
WP Simple Pay stands out as an excellent option for handling Stripe payments without needing a complete eCommerce plugin.
This solution also supports additional payment methods, including credit cards, Apple Pay, Google Pay, and others. It’s particularly suitable for non-profit organizations, small enterprises, and volunteers seeking a straightforward way to manage payments.
To add a payment form, you must first install the WP Simple Pay plugin. If assistance is required, you can refer to our detailed guide on how to install a WordPress plugin.
After activation, simply follow the setup wizard to link your account to Stripe.
Once you are connected, you can begin creating your payment form utilizing WP Simple Pay.
For comprehensive guidance, you can refer to the initial method outlined in our tutorial on how to construct a WordPress form with payment functionalities.
When you are happy with your payment form, feel free to click the ‘Publish’ button. After that, you can copy the form’s shortcode to integrate it into your post or page.
In the WordPress content editor, simply click the ‘+’ button and choose the ‘Shortcode’ block.
Next, you can insert the shortcode for the form into the text area.
It’s important to note that WP Simple Pay sets your payment form to test mode by default. This means that accepting payments from visitors is not yet possible.
To resolve this, let’s head over to WP Simple Pay » Payment Forms in the WordPress dashboard. There, you can hover over the form you just created and click ‘Edit’ when the option appears.
In this panel, you will need to navigate to the ‘Payments’ section.
Finally, you can select the ‘Live Mode’ radio button and then click ‘Update.’
That’s how you can embed a WP Simple Pay form and begin accepting payments from your audience.
Here’s how it appears on our demo site:
Formidable Forms is an excellent solution for building advanced forms, such as mortgage, car payment, or life insurance calculators. It provides over 225 form templates that you can utilize for your WordPress website.
For comprehensive guidance on creating a form using Formidable Forms, a complete review is available for you to explore.
Formidable Forms simplifies the process of adding forms to any post or page. After completing your form, you can simply click the ‘Embed’ button within the form builder.
This action will prompt a pop-up window, allowing you to choose where to place the form. There are three available options: ‘Select existing page,’ ‘Create new page,’ and ‘Insert manually.’
If you choose the ‘Insert manually’ option, it will require you to handle a small amount of code. This aspect might seem a bit daunting for beginners, so we advise against this choice.
For this guide, we will opt for the option to ‘Select existing page.’
Following this, a new prompt will pop up.
At this point, you should open the dropdown menu and select a page. For instance, we decided to embed the form on our demo site’s ‘Home’ page.
Once you’ve selected the page, you can proceed by clicking the ‘Insert form’ button.
By following these steps, you will access the page’s block editor where you will find that the form has been successfully embedded into the page.
You are now prepared to make updates to the page.
Simply click the ‘Save’ button to finalize your changes.
Here’s a glimpse of how it appears on our demonstration site:
Gravity Forms is a robust form-building plugin specifically designed for WordPress, but it’s important to note that it is a premium-only tool.
This form builder comes equipped with numerous features and extensive customization options. It enables the creation of various types of forms, including surveys, quizzes, registrations, and order forms.
To start using Gravity Forms, you will need to acquire the plugin from its official website.
After purchasing, you can proceed to install and activate it on your website. For guidance during this process, we recommend checking out our guide on installing a WordPress plugin for beginners.
After activation, head over to Gravity Forms » New Form in your WordPress dashboard and select ‘Add New.’
On the following screen, you will have the option to pick a form template.
Take your time exploring this pop-up window to locate the template that suits your needs. Upon finding the right one, hover over the template and click the ‘Use Template’ button.
After that, you will be asked to provide a name for your form and include a brief description.
You may refer to the example provided.
Feel free to click on ‘Use Template’ once more to begin creating your form.
This action will launch the Gravity Forms drag-and-drop builder, allowing you to personalize your form with the available fields.
After finalizing your form, don’t forget to click the ‘Save Form’ button to ensure that all your modifications are saved.
Next, proceed by clicking on ‘Embed.’
This action will reveal three methods for incorporating your Gravity Forms form – within an existing page, on a new page, or using a shortcode for those utilizing the classic editor.
In this tutorial, we will focus on integrating Gravity Forms into an already published web page.
At this point, select the ‘Post’ option. Then, access the dropdown menu to select a published post from your WordPress site.
Proceed to click the button labeled ‘Insert Form’.
After that, you will be taken to the content editor of the page, where you will see an option to include the ‘Form’ block. Simply click on it.
Gravity Forms will subsequently insert the form you just built into the post.
You may also observe that it automatically incorporates the ‘Form Title’ and ‘Form Description’ by default.
If you believe everything is in place, it’s time to press the ‘Save’ button.
That’s all there is to it – you’ve successfully created and integrated a Gravity Forms form into your website.
Some individuals may prefer to utilize Microsoft Forms for their form creation needs, as it’s a tool they are accustomed to through their Office 365 accounts. Furthermore, it seamlessly integrates with other Microsoft products like Excel, simplifying data collection and management.
Microsoft Forms provides built-in features for crafting surveys, quizzes, and polls. You can effortlessly embed Microsoft 365 forms in WordPress by copying the form’s embed code and pasting it into your WordPress site.
To begin, you will create your form using Microsoft Forms within your Office 365 account.
Start by visiting the Office 365 homepage and clicking on ‘Sign In’ to proceed.
After logging in, find the menu icon located at the top left corner of the screen.
Next, search for ‘Forms’ in the menu and click on it to continue.
This action will launch the template gallery in a new tab, allowing you to select the forms you wish to create.
Microsoft Forms offers four types of forms to select from: survey, quiz, invitation, and registration. For the purpose of this tutorial, we will opt for the ‘Invitation’ choice. Let’s proceed to click on it.
The editor for Microsoft Forms will then open in a new tab. The first step here is to choose a suitable template.
You can browse through the template options available in the left-hand panel. Since we are focusing on creating an invitation form, there are seven pre-designed templates available for different occasions.
In this tutorial, we will be utilizing a wedding invitation template. Below is a glimpse of what the standard template appears like in the editor:
If you look to the right-hand panel, you will discover the default fields that this template provides.
This template includes four designated fields for inputting users’ names, the total number of guests who will attend, dietary restrictions, and email addresses.
If you wish to include additional questions, simply click the ‘+ Insert new question’ button and select the type of question, such as ‘Date,’ ‘Rating,’ ‘Text,’ or others available.
If you’re looking to modify the current selections, just click on one to reveal the customization options.
To adjust the visual style, click the palette icon.
This will allow you to alter the layout of the form and the background image.
You can then navigate to the settings section by clicking on the gear icon.
Microsoft Forms comes with several basic settings already pre-configured.
However, you may wish to activate the ‘End Date’ feature, which can assist you in planning your wedding day more effectively based on the responses you receive. Additionally, enabling ‘Get email notification of each response’ ensures you have a backup of the data, reducing the risk of losing any important responses.
You also have the option to modify the default confirmation message if desired.
After finalizing the form, you can proceed to launch it.
In the form creation tool, let’s select the button that says ‘Collect responses.’
A popup will show up, and you can click on the icon that resembles ‘</>’ or the embed button.
You should then be able to see the shortcode that you need to integrate into your site. Click on ‘Copy’ to grab it.
Next, you can insert this code into a post or page by utilizing the ‘Custom HTML’ section.
Within the WordPress content editor, click on the plus sign to insert a new block. After that, utilize the search function to find the ‘Custom HTML’ block.
Click on it to incorporate the block into your editor.
Next, simply paste the shortcode from Microsoft Forms into the text area provided.
No need to be concerned if a preview doesn’t appear in your editor; the shortcode will function correctly.
Now, you can click the ‘Publish’ or ‘Update’ button to bring it to life.
Here’s how it appears on our demo site:
HTML forms are typically hand-coded, meaning there isn’t a drag-and-drop editor available for editing your form.
Fortunately, there are various form plugins that streamline the process of creating HTML forms. One of the top choices is the HTML Forms plugin. This plugin is excellent for creating straightforward contact forms that assist in collecting information from visitors.
The wonderful part is that coding skills are not required to utilize HTML Forms.
Incorporating a new field is a straightforward process. Simply select one from the options provided, and HTML Forms will prompt you to customize the field’s data.
Once you press the ‘Add Field to Form’ button, HTML Forms will transform the data into an HTML snippet and place it in the ‘Form Code’ section.
And that’s all there is to it! Remember to click the ‘Save Changes’ button to ensure your progress is saved.
Now, it’s time to publish the form.
HTML Forms allows for easy embedding of your form on any post, page, or widget area. To achieve this, you will need the form’s shortcode. The shortcode can be found at the top section of the ‘Edit Form’ panel.
Next, let’s copy this shortcode to the clipboard.
You can then navigate to the page or post where you wish to display the HTML form. For the purpose of this tutorial, we will be adding the form to our ‘Contact’ page.
After entering the block editor, click on the ‘+’ icon and search for ‘Custom HTML.’ Select it to insert it into your page.
Next, paste the shortcode into the ‘Custom HTML’ block.
The form won’t be visible in the WordPress block editor. However, don’t be concerned. It will appear on the page once you save your changes.
Now, let’s click the ‘Save’ button to view it in action.
Here’s an example of how it could appear on your site:
For a comprehensive guide, refer to our manual on how to incorporate HTML forms within WordPress.
If you have inquiries about integrating forms in WordPress, here are some concise answers to assist you in beginning.
Is it possible to embed forms in WordPress?
Absolutely. You can seamlessly add forms to your WordPress site with the help of various plugins, among which WPForms stands out as an excellent tool for versatile form creation.
How can you install a form in WordPress?
To begin, navigate to the area labeled Plugins followed by Add New in your WordPress admin dashboard. Next, you will need to search for a form plugin that suits your preferences, then proceed to install and activate it. After this step, you can utilize the plugin to design a form and embed it on your site using a shortcode or block.
What’s the process for setting up WPForms in WordPress?
To get started with WPForms, the first step is to install and activate the WPForms plugin. Once that’s done, you can create a new form using the intuitive drag-and-drop builder and easily embed the form on your site with a shortcode or the plugin’s block.
How can you create a form in WordPress without using a plugin?
Creating a form in WordPress without a plugin involves writing custom HTML and PHP. You would need to add the form HTML directly to your page and manage submissions through custom PHP in your theme’s functions.php file. This approach can be complex for beginners, so it’s advisable to opt for a form builder instead.
We hope this article has provided useful information on embedding forms in WordPress. Next, you may want to explore our other guides on how to set up form tracking in Google Analytics and how to monitor and minimize form abandonment.
If you enjoyed this article, consider subscribing to our YouTube Channel for tutorials on WordPress. You can also connect with us on Twitter and Facebook.
Syed Balkhi
Hello, WPBeginner readers,
Did you know that by commenting on WPBeginner, you could win fantastic prizes?
Each month, our leading blog commenters will be awarded amazing rewards, including premium WordPress plugin licenses and cash prizes.
You can find more information about the contest from here.
Join the discussion below for your chance to win!
Welcome to DediRock, your trusted partner in high-performance hosting solutions. At DediRock, we specialize in providing dedicated servers, VPS hosting, and cloud services tailored to meet the unique needs of businesses and individuals alike. Our mission is to deliver reliable, scalable, and secure hosting solutions that empower our clients to achieve their digital goals. With a commitment to exceptional customer support, cutting-edge technology, and robust infrastructure, DediRock stands out as a leader in the hosting industry. Join us and experience the difference that dedicated service and unwavering reliability can make for your online presence. Launch our website.