WordPress Tutorials, Tips, and Resources to Help Grow Your Business
Do you want to increase the visibility of your feedback form and encourage more form submissions? You can increase the visibility of your form by integrating your feedback form with a popup.
In this tutorial, we’ll show you how to create a popup feedback form in WordPress.
Why Create a Popup Feedback Form?
A few benefits of creating a popup feedback form are:
- It encourages more form submissions: Using a popup is one of the best ways to boost form submissions because unlike other WordPress forms, popups can easily grab the attention of your visitors.
- Your visitors don’t need to navigate away: Unlike other forms, visitors don’t need to navigate away to submit your popup forms. They can submit it on the same page.
- Collect feedback entries in your dashboard: With the right setup, you can collect and organize all the feedback entries right in your WordPress dashboard.
WPForms lets you easily create any kind of form right in your WordPress dashboard, while OptinMonster is the best popup builder tool on the market. When a WordPress form is integrated with OptinMonster, you can create multiple types of popups such as lightbox popup, floating bars, slide-ins, etc. that are optimized for conversions.
Install WPForms and OptinMonster
Before we get started, you’ll need to install and activate two plugins: WPForms and OptinMonster.
After installing and activating WPForms plugin, you need to subscribe to OptinMonster’s Pro license. Upon subscription, install and activate the free WordPress plugin and then connect it with your OptinMonster account. For more details, you can learn how to install the OptinMonster WordPress plugin.
Create a Feedback Form With WPForms
Then, go to your WordPress dashboard and create a feedback form with WPForms.
In this form, we’ll be using the following fields.
- How likely are you to recommend this product/company to a friend?
See the screenshot below.
For more details, you can see our tutorial on creating a simple contact form in WPForms.
Once you are done, you need to click on the Save button to store your changes.
Now that we have a feedback form ready, let’s move on to the next step and create a lightbox popup in WordPress.
Create a Popup Using OptinMonster
Now, log into your OptinMonster account and click Create Campaign.
Now you’ll be asked to select your campaign type. Choose Lightbox Popup.
If you want to know more about using canvas popup, read 9 unique canvas popups you can create with OptinMonster.
Now you’ll be prompted to name your popup. Let’s name it as Feedback Popup.
Make sure to choose the right website for your optin campaign.
Also, set both Optin Cookie Duration and Optin Success Cookie Duration to 0. This will stop OptinMonster from setting duration cookies so that your form will remain visible to every visitor every time they click the link.
Now you’ll be directed to optin form builder. In the left taskbar, click on Optin and then choose the height and width of your canvas. By default, it is set to 700 x 350 px. Let’s set the height to 520 at least.
In the Canvas custom HTML box, you can enter your feedback form shortcode along with any other custom HTML you may want to add.
Here is a sample HTML we used to create the modal popup for this tutorial. Make sure to replace the shortcode with your own form’s embed code.
<h3>Please Tell Us Your Feedback?</h3> <p class="tagline">Simply fill out this form and let us know your comments. </p> [wpforms id="593"]
To obtain the embed code for the feedback form you just created, go back to your WPForms builder, click on the Embed button at the top right corner. You’ll now see your embed code. Just copy it and replace the embed code placed in the above HTML.
Now we want to make sure that our popup is triggered only when a visitor clicked on a particular link or a button. To do this, go to Display Rules » MonsterLink and change the status to Active.
If you want to set up your popup feedback form to appear with other triggers (such as after a certain number of seconds, or only on certain pages, or on exit intent when a visitor is about to leave your site), you can set that up here as well.
Now click Save on top right hand corner.
Publish the Popup on Your Site
Now return to your WordPress dashboard and click the OptinMonster menu. You’ll see a list of campaigns you created on your OptinMonster account. If you can’t see any, make sure to click Refresh Optins.
Click on the Edit Output Settings link below your optin. This will bring you to output settings for the popup.
Now enable the optin by clicking the checkbox below Enable optin on site?
Then, click Save Settings.
Add a Link to Trigger Feedback Form Popup
Now go back to the OptinMonster menu to copy your OptinMonster optin’s slug.
Create a new page in WordPress or edit a post or page where you want to add the contact form popup link or button. Add the following code, replacing the data-optin-slug with your own optin slug.
<a href="#" class="manual-optin-trigger" data-optin-slug="txgaducbrgdshyd9gljo">Feedback</a>
In the post editor, switch to text editor and add your popup link like this:
Now publish the post or page.
That’s it! You’ve just published a feedback form popup on your WordPress site.
Want to learn even more from your website visitors? Check out these clever web form hacks to uncover hidden data.
What are you waiting for? Get started with the most powerful WordPress forms plugin today.