Tag - Forms

How to Use Dynamic Field Population in WordPress to Auto-Fill Forms

Do you want to use dynamic field population in WordPress to auto-fill forms on your website?

Dynamic field population allows you to automatically fill form fields based on user selection, query strings, or field type.

This makes your forms smart, saves users time, deliver a better user experience, and ultimately improves form completion rate.

In this article, we’ll show you how to use dynamic field population in WordPress to auto-fill forms.

Automatically fill form fields in WordPress with Dynamic field population

What is Dynamic Field Population?

Dynamic field population is a technique that allows website owners to automatically fill form fields based on user selection, form type, query strings, or conditional logic.

For example, an eCommerce store can create a form where product field in the form is dymanically populated using existing products in WooCommerce or any other eCommerce software.

Similarly, a real estate website can automatically populate listings, agents, property type fields in their appointment and lead generation forms.

Advanced users and developers can also use URL parameters to dynamically fill out form fields using smart links from email newsletter or other website interactions.

Having said that, let’s take a look at how to easily use the dynamic field population in WordPress.

How to Use Dynamic Field Population in WordPress

First, thing you need to do is install and activate the WPForms plugin. For more details, see our step by step guide on how to install a WordPress plugin.

WPForms is the best WordPress contact form plugin on the market. It allows you to easily create online forms using a simple drag and drop tool.

It also comes with dynamic field population, conditional logic, and advanced form fields. Together, these features allow you to create smarter and interactive forms for your website.

Note: WPForms is co-founded by WPBeginner founder, Syed Balkhi.

Upon activating the plugin, you need to visit the WPForms » Settings page to enter your license key. You can find this information under your account on the WPForms website.

WPForms License key

Next, you need to visit WPForms » Add New to create your first form. You’ll be asked to provide a name for your form and then select a template to start.

Creating a new form

WPForms will now load your form with pre-selected fields. You can click to edit form fields or use drag and drop feature to move them up and down. You can also add and remove form fields with just a click.

Let’s add a new form field to populate it with dynamic choices.

You can add a dropdown, multiple-choice, or a checkbox field to your form to use dynamic choices options. Simply click on a field from the left column to add it to your form.

Add form fields

Next, click to edit the field and then expand the Advanced Optins menu from the left column.

Advanced options

From here, you need to select a dynamic option under Dynamic Choices. WPForms supports post types and taxonomies registered on your WordPress site. For the sake of this tutorial, we’ll select Products post type.

Dynamic choices

WPForms will now automatically load and display the fields in the form preview.

You can now save your form and exit the form builder.

To add the form in a WordPress post or page, simply edit the post or page where you want to add it.

On the post edit screen, add WPForms block to your post edit area. After that select the form you created earlier from the drop down menu.

Adding WPForms block in WordPress

You can now save your post or page and visit your website to see your form with dynamic field values in action.

WPForm preview

Automatically Fill Form Fields Using URL Parameters

WPForms also allows you to dynamically fill form fields using URL parameters. This allows you to create smart links that automatically pass down information to the form and fill it for your users to submit.

First, you need to create a new form or edit an existing form in WPForms. Once you are done creating your form, switch to the settings tab from the left column and then select the ‘General’ tab.

On this screen, you need to check the box to Enable dynamic field population.

Enable dynamic fields

You can now save your form and exit the form builder. Your form is now ready to dynamically populate form fields using URL parameters.

Creating Links with URL Parameters

WPForms accepts dynamic form fields passed through URL parameters in a specific format.


Let’s break it down.

  • The part of the URL before the question mark ‘?’ is the URL of the page that has your form. For example, your contact form page.
  • ?wpf – Indicates the start of the WPForm form field parameters.
  • 15 – Is the ID of your form
  • _1 – Next you have the field ID
  • =value – = indicates the start of the value you want to pass to the form followed by the actual field value.

Here is an example of a URL where we are passing a product title as a text field to a feedback form.


Adding URL to your post

Notice, how we have used %20 to indicate spaces between words in the product title.

Finding Form and Field IDs in WPForms

In order to create URL parameters, you’ll need to know the form and field IDs. Here is how you can find these values.

Simply edit your form, and you will see the form ID in your browser’s address bar.

Finding form ID in WPForms

Similarly, in order to find the form field ID, you need to just click to edit it. You will see form field properties in the left column along with field ID at the top.

Finding the form field ID

Now, what if you wanted to pass a value to a subfield?

Simply add the subfield identifier after the field ID in your URL like this:


For more details, see WPForms developer documentation which shows more examples to use different parameters for all types of form fields.

You can now use this feature in combination with your CRM software or email marketing service to send smart form links to your users. Most marketing platforms come with their own personalized MERGE tags that you can add in the smart URL to automatically fill personal information in the form.

You can also use dynamic field population feature with other form plugins like Formidable Forms, Gravity Forms, etc. However, we recommend using WPForms because it makes the whole process easy, and we know it well because we built the product.

We hope this article helped you learn how to use the dynamic field population in WordPress to auto-fill forms. You may also want to see our article on how to track and reduce form abandonment in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Use Dynamic Field Population in WordPress to Auto-Fill Forms appeared first on WPBeginner.

Source link

How to Restrict Your WordPress Forms to Logged-in Users Only

Are you looking for an easy way to restrict your WordPress form submissions to logged-in users only?

If you have a membership site, online store, or another type of website that has registered users, then you may want to restrict certain forms access to only logged in users.

In this article, we will show you how to restrict your WordPress forms access so only logged in users can fill out and submit them.

Restrict Form Access in WordPress

When and Why You Need to Restrict Access for WordPress Forms?

There could be a number of scenarios when you would need to restrict access to certain WordPress forms to logged-in users only.

For example:

  • You may be hosting a private members event, and you only want registered users on your site to RSVP.
  • You may restrict access to support for members only, and by restricting it to logged-in users only, you can dynamically populate certain information from their profile.
  • You might want to run an employee survey or poll, and you want to restrict access to your internal team only.
  • You are running a customer NPS survey that you only want to be submitted by logged-in users only.
  • You might have a special prize claim form that you want to be accessed by only certain logged-in users.

These are just some examples, but there could be literally hundreds of other use cases where you want to restrict form access to registered users only.

With that said, let’s take a look how to restrict your WordPress form access to logged-in users only.

Method 1: Restrict Form Access with WPForms Form Locker Addon

This method is easiest and most powerful, so we recommend it for all beginner users. We will use the WPForms plugin and their Form Locker addon to completely lock down WordPress form access.

WPForms is the best WordPress form plugin used by over 2 million websites. It was created by WPBeginner’s founder, Syed Balkhi, to have all the features we needed for running our business.

The first thing you need to do is install and activate the WPForms plugin. For more details, see this step by step guide on how to install a plugin in WordPress.

Upon activation, you need to enter your license key and then add over to the WPForms » Addons page to install the Form Locker Addon.

WPForms Form Locker Addon

Now you’re ready to create a new form that has restricted access for logged-in users.

To do this, go ahead and create a new form by going to WPForms » Add New. This will open the WPForms form builder where you will be presented with the option to either choose a form template or start with a blank one.

WPForms drag & drop form builder is extremely easy to use, so you can add or remove fields and customize the form to your liking.

WPForms Form Builder

Once you have added all the necessary fields, you need to go to the Settings Tab and click on Form Locker.

WPForms Form Locker Settings

On this tab, you will see the option to enable password protection for your WordPress forms, set total entry limits, enable form scheduling, and enable restricting entries to logged-in users only.

Form Locker Logged in User Only

Once you check the box, you will see a new Message field where you will need to draft a message that will appear to all users who are not logged in to your site.

WPForms Form Locker Restrict Access Message

Once done, you can tweak other form settings that you might need and then click the Save button.

Now you can embed this form on any WordPress post or page on your site by using the WPForms shortcode in the Classic Editor or by using the WPForms block in the Gutenberg editor.

Simply go to Post or Pages, and then click on the Plus icon to select a block. Next, type WPForms in the block search.

Add WPForms block to WordPress post or page

Once the WPForms block is added, select your form to embed and you’re done. Congratulations, you have successfully created a WordPress form that’s restricted to logged-in users only.

Method 2: Restrict Form Access with Password Protected or Private Pages

Another way to restrict form access in WordPress is by using the default WordPress visibility settings. You can use this method with the free version of WPForms or any other contact form plugin.

Simply create a Page or Post where you want to embed the form. After that click on the Visibility settings on the right panel.

WordPress Page Visibility Settings

You have the option to either make the whole page private or make the whole page password protected.

Private pages can only be seen by the Administrators and Editor level users on your website.

If you set a password for the page, then you will have to share that password with everyone who you want to give access to.

While this method works, there are several downsides to it.

First, the entire page is hidden not just the forms area. You lack the finer controls, and there’s no way for you to see which logged-in user submitted the form (if you’re using the password protected setting).

Method 3: Use Advanced Membership Plugins to Restrict Form Access

If you’re using an advanced WordPress membership plugin like MemberPress, then it comes with a lot of access control features built-in.

You can simply go to MemberPress » Rules to create a new permissions rule.

Add new rules in MemberPress

The rule edit page allows you to select different conditions and associate them to a membership plan.

For example, you can select all content that matches a particular tag or category to be available only to members with the silver subscription plan.

Add a rules set to MemberPress

You can also create more specific rules. For example, a single post or page, child pages, or a specific URL.

Once you have set the rules, you can use it in combination with any WordPress contact form plugin to restrict form access to logged-in users only.

For more details, see our step by step guide on how to restrict content access in WordPress.

We hope this article helped you learn how to restrict your WordPress forms to logged-in users only. You may also want to see our list of best WordPress plugins for business websites.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Source link

How to Create AMP Forms in WordPress (The Easy Way)

Do you want to create AMP-friendly forms on your WordPress site?

Accelerated Mobile Pages or AMP is a Google project that makes websites load faster on mobile devices.

While AMP offers a great mobile browsing experience by making your webpages load faster, it disables many useful features on your website.

One of them is contact forms. Since AMP uses a limited set of HTML and JavaScript, it cannot load your WordPress forms properly on AMP pages.

But thankfully, now there is an easy solution available. WPForms, the most beginner-friendly WordPress form plugin now helps you create AMP-ready WordPress forms. Their team recently worked with Google to make AMP forms easy for WordPress.

In this article, we will show you how to create AMP forms in WordPress using WPForms (the easy way).

Creating AMP Forms in WordPress (The Easy Way)

Creating AMP Forms in WordPress (Step by Step)

In order to use AMP with WordPress, you need to install and activate the official AMP plugin for WordPress. For more details, see our step by step guide on how to install a WordPress plugin.

Once activated, the plugin will automatically add Google AMP support for your WordPress site.

However, you can change AMP settings for your website by going to AMP » General from your dashboard.

AMP for WordPress Settings

From the AMP settings page, you can enable or disable AMP on your website, choose a website mode for AMP, and choose supported templates.

Once you have configured AMP, the next step is to create an AMP compatible contact form on your WordPress site.

Step 1. Create a WordPress Form with WPForms

To get started, install and activate the WPForms Lite plugin on your site. It is the lite version of the WPForms Pro plugin.

Both the lite and pro version of WPForms allows you to create a basic AMP ready contact form. In our article, we will be using the free version for screenshots.

Once the plugin is installed and activated, you need to head over to WPForms » Add New page to create a new WordPress form.

On the form setup screen, you can choose a form template to get started quickly. You can select the Blank Form if you want to start from scratch.

Form Templates WPForms

Next, it will open the form builder page.

Drag and Drop Form Builder WPForms

From here, you can add or remove form fields. To add a new field to your form, you can simply click on a form field from the left panel, and it will appear in the form builder panel on the right.

After that, you can configure the field options. Simply click on a field, and then Field Options will appear.

Configuring Field Options in WPForms Plugin

Similarly, you can customize all the other fields.

After that, you can click on the Settings tab to configure your form settings.

WPForms General Settings

The General Settings allow you to change your form name, submit button text, submit button processing text, enable anti-spam Honeypot, and more.

Next, you can click on the Notifications tab to set up email notifications to notify you when a user completes the form.

WPForms Notification Settings

Next, you can click on the Confirmation tab to set up a confirmation message to be shown when a user submits the form.

WPForms Confirmation Message Settings

After the configuration is complete, you can save your form.

Step 2. Add Your AMP Form to a Page

Now that your WordPress form is ready, you can add it to a page.

First, you need to create a new page or open an existing one where you want to add the form.

On your page edit screen, click on the Add New Block icon and select the WPForms block.

Add WPForms Block to WordPress Page Editor

After that, you can see the WPForms widget added to your page edit screen. You just need to select the form you created earlier, and the widget will instantly load it in the page editor.

Add Contact Form to WordPress Page with WPForms

Next, you can publish or update your page.

That’s all! You don’t need to configure anything else. The WPForms Lite plugin will add full AMP support to your form now.

If you want to see how it looks, then you can open the page on your mobile phone.

Or you can open the page on your desktop browser by adding /amp/ or /?amp at the end of your page URL. For example, https://www.example.com/contact/?amp.

Adding Google reCAPTCHA to Your AMP Form

By default, WPForms includes anti-spam honeypot to catch and block spam. Additionally, you can use Google reCAPTCHA to reduce spam submissions.

To use Google reCAPTCHA with your AMP forms, you need to register your site for Google reCAPTCHA v3 and get the Google API keys.

Go to the Google reCAPTCHA website and click on the ‘Admin Console’ button at the top right corner of the page.

Visit Google reCAPTCHA website

After that, you need to sign in with your Google account. Once done, you will see the ‘Register a new site’ page.

Register a New Site for Google reCAPTCHA

First, you need to enter your website name in the Label field. Google AMP only supports reCAPTCHA v3, so you need to choose it from the reCAPTCHA type options.

After that, enter your domain name under the Domains section.

Add Domain Name and Owner for Google reCAPTCHA

The Owners section shows your email address by default. You can also add another email if you want.

Next, you need to accept the reCAPTCHA Terms of Service to continue. Also, select the ‘Send alerts to owners’ checkbox, which will allow Google to notify you about problems like misconfiguration and suspicious traffic on your site.

Accept Google reCAPTCHA Terms of Service

Once done, click on the Submit button.

Next, you will see a success message along with the site key and the secret key to add reCAPTCHA on your site.


Now you have the Google API keys to add reCAPTCHA to your forms. However, there is one more adjustment required to ensure AMP compatibility with the reCATCHA. Click on the ‘Go to Settings’ link there.

Next, you will see the reCAPTCHA settings again with ‘Allow this key to work with AMP pages’ checkbox. Simply check the box and click on the Save button below.

Allow reCAPTCHA to work on AMP Pages

Now that you have Google API keys to add reCAPTCHA on AMP forms, you need to open WPForms » Settings » reCAPTCHA page in your WordPress dashboard.

WPForms reCAPTCHA Settings WordPress

On this screen, you need to choose reCAPTCHA v3 option and paste the site key and secret key. After that, click on the Save Settings button.

Now that Google reCAPTCHA is added to WPForms, you can enable it in your forms where needed. Go to WPForms » All Forms and select the form where you want to enable the reCAPTCHA.

Edit a Form Created with WPForms

Once the form setup screen appears, click on the Settings tab and select the General Settings section. At the bottom, you can see ‘Enable Google v3 reCAPTCHA’ checkbox.

Enable Google v3 reCAPTCHA in WPForms

Check the box and then save your form by clicking on the Save button at the top right corner.

After that, you can revisit your contact page and see the AMP form with reCAPTCHA in action.

We hope this article helped you to learn how to create AMP forms in WordPress easily. You may also want to see our guide on how to create GDPR compliant forms in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook

Source link

How to Create Conversational Forms in WordPress (Typeform Alternative)

Do you want to make your forms feel more human? Many of our readers have asked us to write a tutorial on how to create a Typeform-like form in WordPress.

Unlike a traditional contact form or survey form that lists all question at once, conversational forms take a one question at a time approach similar to a face-to-face conversation.

This makes conversational forms less overwhelming for users and result in higher form completion rate. In this article, we will show you how to create a conversational form in WordPress.

How to Create Conversational Forms in WordPress Easily

Conversational Form Plugin for WordPress (Typeform Alternative)

Previously it was hard to create conversational forms in WordPress because there wasn’t a good WordPress-focused solution.

Several SaaS applications offered this feature with Typeform being the most popular one, but it had several downsides:

  • Typeform is a SAAS (software as a service) tool which stores your forms data on their servers. This means you’re trusting someone else for your data security.
  • Typeform is expensive if you’re a small business. The premium plans start from $30 / user / month, and if you want more features, then it costs $59 / user / month.

While Typeform offered a free plan, it was too limited which made it less attractive for WordPress users.

This is why we asked our team at WPForms to create a Typeform alternative for WordPress.

Conversational Forms by WPForms lets you create interactive WordPress forms without the high costs of Typeform.

WPForms Conversational Forms Addon

See the Conversational Form Demo

WPForms is the most user-friendly WordPress form plugin that’s used by over 1 million websites.

This new addon helps you transform any form into a conversational form in less than 90 seconds.

Unlike Typeform, WPForms is an open-source WordPress plugin which means all your form data is stored on your website, not some third-party app.

WPForms is more cost-effective than Typeform. You can buy the yearly plan for $199 which gives you unlimited forms, surveys, and tons of other powerful features including Conversational Forms.

Let’s take a look at how to easily create a conversational form on your WordPress website.

Disclosure: WPForms is created by the same team behind WPBeginner. It is one of our premium WordPress plugins.

Creating Conversational Forms in WordPress

First thing you need to do is install and activate the WPForms plugin. For detailed instructions, please see our step by step guide on how to install a WordPress plugin.

You will need at least the ‘Pro’ plan to access the ‘Conversational Forms Addon’. WPBeginner users can get 50% OFF on all WPForms licenses using our WPForms coupon.

Once the plugin is activated, you need to visit the WPForms » Settings page to verify your license key. You can find this information in your account area on WPForms website.

WPForms license

Next, you need to go to WPForms » Addons page and find the Conversational Forms addon.

Install Conversational Forms addon by WPForms

Simply click the install button, and the plugin will install and activate the Conversational Form addon within a few seconds.

When you see the addon status as ‘Active’, it means that you can start using it.

WPForms Conversational Forms addon active

You can enable conversational forms for any new or existing forms created with WPForms.

Conversational forms are useful in reducing form abandonment. The interactivity and face-to-face conversation approach leads to a higher form completion rate.

This is highly effective on the following types of forms:

These forms are typically longer and include more fields. If you display all those questions at once, then users feel overwhelmed and abandon the form.

Conversational forms fix this by asking users to answer one question at a time. Instead of a tedious long form, it feels more interactive and keeps users engaged.

In this example, we will show you how to create a conversational survey form.

First, you need to create a regular survey form. You can do this by clicking on WPForms » Add New in your WordPress admin area. For more details, see our step by step guide on how to create a survey in WordPress.

Creating a form with WPForms is easy using its simple drag and drop interface. You can drag form fields on the left to the form editor on the right side.

For instance, here’s how a sample WPForms survey form editor looks like:

Editing Survey Form with WPForms

Once you have added your survey questions, go to Settings » Conversational Forms tab on the left panel. You need to check the ‘Enable Conversational Form Mode’ box.

Enable Conversational Form Mode in WPForms

After that, you will see the conversational form settings and customization options. These options allow you to design an attractive conversational form landing page with your logo, color scheme, and message.

Conversational Form Landing Page Options WordPress

You can preview your form anytime by clicking on the ‘Preview Conversational Form’ button on the top right corner under Conversational Form settings.

Preview button for Conversational Forms WordPress

At first, you will see the Conversational Form Title field. You can enter a short descriptive title for your form there. For example: Please, Take Our Survey!

WPForms Conversational Form Title

Next, there is a Message field where you can add a short message to encourage your users to complete the form.

Conversational Form Landing Page Message

As you scroll down, you will see the Permalink option.

The permalink is a unique URL for your conversational form landing page. The plugin automatically creates it for each conversational form by using your form’s title. You can change that if needed.

Conversational Form Page Permalink Option

While setting up a permalink, make sure that it is short and simple because you may want to use this URL in your email campaigns or social media posts.

Next thing you can do to customize your conversational form page is to add a header logo. Click on the ‘Upload Image’ button, then choose an image to upload.

Upload Header Image in Conversational Form Landing Page

Below that, you’ll see a checkbox option to hide WPForms branding. Check the box next to ‘Hide WPForms Branding’ if you don’t want to display ‘powered by WPForms’ message on your form landing page.

You can preview how the branding appears by clicking the Preview Conversational Form button on the top right corner.

WPForms Branding in Conversational Form Landing page

After that, there is a Color Scheme option to customize your form Submit button and page background. You can use one of the pre-set colors or choose a new color by using the color picker.

Choose a Color Scheme for Your Conversational Form Page

Lastly, there is the Progress Bar option. You can choose one from the 2 styles: Percentage and Proportion.

WPForms Conversational Form Progress Bar Options

If you want to see how each progress bar style looks, you can select the styles one by one and preview the form. Or you can see our screenshot:

Conversational Forms Progress Bar Styles - Percentage vs. Proportion

Once you have configured all your conversational form settings, you can preview it to see how it looks on a live site. Next, click on the ‘Save’ button on the top to store your settings.

Save Conversational Form Landing Page Options

That’s it!

Now you can open your conversational form link in your browser to see it in action. Here’s how our conversational survey form page looked:

Conversational Form Landing Page Preview

You can check the official WForms Conversational Forms demo to see how the interactive form elements works.

Now that your conversational form landing page is ready, you can add the link to your WordPress Navigation menu, use it in your email campaigns, social media updates, or blog posts.

We hope this article helped you learn how to easily create conversational forms in WordPress. You may also want to check out our guide on how to track user engagement on your site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Source link

Form Pages by WPForms – Google Forms Alternative for WordPress

Have you ever tried creating a distraction-free form landing page in WordPress? If so, then you likely realized that it is not easy.

The biggest challenge with WordPress forms until now has been that all form layouts are controlled by WordPress themes, and sadly most WordPress themes do not prioritize form layouts.

This forced a lot of WordPress users to use Google Forms to create standalone forms which isn’t an ideal workflow. Since there wasn’t a perfect Google Forms alternative in WordPress, we created one.

Today, I’m excited to announce the launch of Form Pages by WPForms, a “distraction-free” form landing page builder for WordPress to help you improve your form conversions.

Form Pages by WPForms Preview

Form Pages addon for WPForms allows you to quickly create dedicated form landing pages without hiring a developer or writing any code in less than 5 minutes.

Like everything else in WPForms, we made the process “stupid simple”.

You can create a custom landing page for any of your WordPress forms by simply enabling the “Form Page Mode” from the Form Settings.

Form Pages by WPForms

On the settings page, you can add your logo, custom page title, description, and define the landing page URL.

It comes with two different form styles Modern and Classic. The Classic style will give you the exact same look-and-feel of Google Forms whereas the Modern Design will allow you to bring your form into 2019.

You can combine the form styles with six pre-made color schemes. You can also build a custom color scheme by selecting the main color. WPForms will then generate other colors and gradients to automatically build your color scheme.

Once done simply save your settings, and that’s it.

Your custom form landing page is ready to be shared.

Form Pages by WPForms is the perfect Google Forms alternative for WordPress because it lets you build custom form landing pages and combine it with other powerful WPForms features such as smart surveys, conditional logic, payment integrations, marketing integrations, user registration, form abandonment technology, and so much more.

Form Pages addon is available as part of the WPForms Pro plan.

If you’re serious about improving your form conversions, then you need get started with WPForms Pro today.

Bonus: You can get 50% off WPForms when using the coupon code: SAVE50

Thank you as always for your continued support of WPBeginner and our products. We look forward to bringing you even more powerful solutions in 2019.

Syed and the WPBeginner Team

Source link