シードプロッド最新ニュース

ビジネスの成長に役立つWordPressのチュートリアル、ヒント、リソース

WordPress add fields to registration form

カスタムフィールドを使ったWordPressユーザー登録フォームの作り方 

執筆者 著者イメージ ステイシー・コリン
著者イメージ ステイシー・コリン
ステイシーはWordPressとデジタルマーケティングについて10年以上、その他のトピックについてはもっと長い間執筆している。また、ウェブデザイン、ユーザーエクスペリエンス、SEOにも造詣が深い。
     レビュー Turner John
レビュアーイメージ Turner John
ジョン・ターナーはSeedProdの共同設立者です。彼は20年以上のビジネスと開発の経験があり、彼のプラグインは2500万回以上ダウンロードされています。

Do you want to create a custom user registration form? And do you want to add custom fields to gather extra information from registered users on your WordPress site or WooCommerce store? 

You can make the entire process easy by creating custom registration forms in WordPress on a dedicated registration page. So in this article, we explain how to use a WordPress plugin for user registration forms with custom fields.

That way, users can sign up and add all the details they need to their profile page.

Why Create Forms With Custom Fields?

Chances are, many of the WordPress registration forms you’ve tried in the past don’t have the option to add specific types of information. 

For example, your registration form might need people’s social media profile links to flesh out their profile areas. Or you might want users to enter their website address or phone number.

Creating a new user registration form that lets you add custom fields and new field names gives you more control over the details required to fill in your form and register.

What’s more, when you use a WordPress user registration plugin with custom fields, you won’t need to start from scratch, saving you tons of time you can use to focus on other areas of your business.

Creating Custom WordPress Registration Forms

Now that you know why adding custom fields to registration forms is important, let’s create one in WordPress.

wpforms WordPressレスポンシブフォームビルダープラグイン

For this tutorial, we’ll be using WPForms, the best WordPress contact form plugin. WPForm’s form builder makes it easy to create any kind of form for your website. And with the Registration Addon, creating forms with custom registration fields is a breeze.

詳しくはWPFormsのレビューをご覧ください。

So go ahead and get your copy of WPForms here. You’ll need the Pro version to take advantage of ready-made registration form templates. Then when you’ve downloaded the plugin, you can learn how to install a WordPress plugin here.

Advanced custom fields plugin

We’ll also be using the Advanced Custom Fields plugin to add custom field types to WordPress, which you can then use in your registration form.

When you’ve downloaded and installed the plugins to your WordPress dashboard, you need to move on to Step 1 to build your user registration form.

Step 1: Build a WordPress User Registration Form

To begin building your user registration form with custom fields, head to WPForms » Addons from your WordPress admin backend. Then locate the User Registration Addon and click Activate.

User registration form addon WPForms

Next, go to WPForms » Add New to create a new form.

Then on the setup screen, give your form a name and choose the User Registration Form template.

User registration form template

Upon clicking the template, WPForms creates a default user registration form, which you can go on to customize.

You can rearrange the fields on your form by dragging elements to a different position. And adding new form fields to the default registration form template is as simple as dragging them from the left-hand panel and dropping them on the right-hand panel.

User registration form builder

But how do you add custom fields to your user registration form? Let’s look at that next.

Step 2: Add Custom Fields to Your Registration Form

For this tutorial, we’ll demonstrate how to add custom profile fields to your registration forms. This is where the Advanced Custom Fields plugin mentioned earlier comes into play.

So to begin, you’ll need to add custom profile fields to your WordPress website. To do that, go to Custom Fields » Add New

Then give your field group a name like “User Profile.” After that, click Add New to add a field to that group and enter the name and label details.

Add new custom WordPress field

When you’re happy with the input type details, click Publish to activate your custom field. Then to see it in action, navigate to your WordPress profile by clicking Users » Your Profile.

As you can see in the image below, your profile now has a field for your Facebook URL.

Custom user profile field for Facebook

Now that we’ve created the custom field in WordPress let’s add it to your user registration form.

Head to WPForms » All Forms to see a list of the forms you created. Then click Edit on the user registration form you created a little earlier.

After that, drag the Website URL field placeholder from the left-hand panel and drop it onto your form preview.

Website URL field

Since we’re adding a Facebook URL option, we’ll need to change the name of the field. To do that, click the website URL field and edit the label and description in the left panel.

Customize field labels

You might also like to add a checkbox asking users to opt into your email list. This is an excellent way to grow your subscribers.

Don’t forget to click Save to confirm your changes.

Step 3: Customize Your Form Settings

The next step is to customize your form settings so your custom field sends the information to the right place.

So click the Settings tab and navigate to User Registration. On this page, you can configure the user registration settings such as:

  • Map each form field
  • Select default user role
  • Enable notifications for the user email
  • Select which confirmation page to redirect users

And if you scroll to the bottom of the page, you’ll see a new section for your custom meta information.

Custom User Meta Details

Here you can enter the meta key you assigned to the custom field you created earlier. When you’ve done that, click Save.

Step 4: Configure Your Form Notifications

Now let’s look at the notifications page by heading to Settings » Notifications.

Registration form notification settings

By default, notifications are switched on, which means you’ll receive an email notification whenever someone registers on your website. 

For help configuring these settings, check out the WPForms documentation on how to set up form notifications in WordPress.

Step 5: Set Your Confirmation Message

We’ll look at setting up messages that users will see when they submit a user registration form for this step.

This is helpful if you need users to confirm their account to complete the registration process, as you can show a message thanking them for registering and to watch out for your validation email.

User registration form confirmation settings

There are 3 confirmation types in WPForms, and they are as follows:

  1. Message – This is the default confirmation. When users complete your form, a message appears, letting them know it went through successfully.
  2. Show Page – This confirmation type sends users to a specific web page on your site thanking them for registering. For instance, you can show your login page immediately after they register.
  3. Go to URL (Redirect) – This option is used when you want to send customers to a different website.

When you’ve chosen your confirmation message type, click Save and move on to adding your user registration form with custom fields to WordPress.

Step 6: Publish Your Registration Form With Custom Fields

WPForms makes it really easy to add your registration form to your website. You can publish your registration form in a post, page, or even on your website’s sidebar on the front end.

Let’s look at publishing your user registration form on a WordPress page.

To start, go to Pages » Add New to create a new Page.

Then in the WordPress editor, click the Plus (+) icon to add a new content block. In the search box, type WPFroms to reveal the WPForms block and click to add it to your page.

add the wpforms block to the WordPress editor

Here, you can choose your user registration form from the drop-down box, which is added to your page to preview.

Choose your form from the dropdown box.

Now you can go ahead and add any further information to your page. And when you’re happy, click Publish to launch your form on your website.

WordPress user registration form with custom fields

それで終わりだ!

You now know how to create a WordPress user registration form with custom fields. So users can register on your site and submit all the details you need to build their profiles.

If you’re interested in learning what else you can do with WPForms, have a look at our other WordPress form tutorials here:

And if you’d like, follow us on Facebook and Twitter for more helpful tips and tutorials.

著者アバター
ステイシー・コリン ライター
ステイシーはWordPressとデジタルマーケティングについて10年以上、その他のトピックについてはもっと長い間執筆している。また、ウェブデザイン、ユーザーエクスペリエンス、SEOにも造詣が深い。

情報開示私たちのコンテンツは読者支援型です。つまり、あなたが私たちのリンクをクリックした場合、私たちはコミッションを得る可能性があります。私たちは、読者に付加価値をもたらすと信じる製品のみを推薦します。