Registration Form for WooCommerce

Streamline your customer registration process and gather valuable data with Registration Form Fields for WooCommerce. This plugin empowers you to effortlessly add custom fields to your registration form, providing a more comprehensive user experience and enriching your customer insights.

Installation #

  • Download the Registration Form for the WooCommerce Plugin.
  • Go to: WordPress Admin > Plugins > Add New and Upload Plugin.
  • With the file you downloaded, select Choose File.
  • Install Now and Activate Plugin.

Creating a New Registration Form #

To create a new registration form, you will be using Gutenberg Editor. Follow the steps below.

  • Go to Registration Forms > Add form.
  • First of all, give the name of the form. By default, you will get a name like Form #123. You can edit it as per your requirements. We have named the form ‘Registration Form’
  • Add the desired form fields from the ‘+’ button on the bottom of the form.
  • To find all the available form fields, either click on the Browse all button or click on the ‘+’ sign on the top left.
  • For each field, you will find options to set the field label, placeholder text, hide label, description, field width, Custom CSS Classes, and enable the required field by clicking the respective field. Check the ‘Settings’ on the Right Sidebar under ‘Block’.
  • Now click on Publish to save the form’s progress.

How to display the registration form on your site? #

Once you have created the form and published it, you can copy the shortcode of the form from the top bar and add this shortcode to the desired page/post.

  • Go to the editor of the desired page, and paste this shortcode.
  • Click on Publish and your registration page is ready.
  • You can also find the form’s shortcode from Registration Form > All Forms.

Getting Familiar with Forms Fields #

Default Fields #

  • Username: This field allows the users to enter their desired username for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, etc.
  • Email Address: This field allows users to enter their email addresses. And, checks if the user has entered a valid email address on the frontend. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, etc.
  • Password: This field allows users to enter their desired password for user registration. The user can use this password for the login process after the registration is completed. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, etc.
  • First Name: This field allows the users to enter their First Name for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.
  • Last Name: This field allows the users to enter their Last Name for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.
  • Display Name: This field allows the users to enter their Display Name for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.
  • Nickname: This field allows the users to enter their desired Nickname for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.
  • Website: This field allows the users to enter their Website URL for registration at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.
  • User Bio: This field allows the users to write the bio or introduction for themselves when registering at the frontend of the form. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc.

Custom Fields #

  • Secondary Email: This field allows the users to enter a secondary email address. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc
  • Input: This field allows you to retrieve any user input that you require. You can customize the label name according to your needs. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc.
  • Text Area: This form field allows you to retrieve any type of information (usually a paragraph) from the user. You can use this field to get descriptive and lengthy responses from your users. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc.
  • Number: This field allows you to receive any numerical information in your forms. You can use this field for accepting users’ contact numbers or any other numerical values. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc. Furthermore, you can change the following additional settings for this field.
    • Min Value: The minimum numerical value users are allowed to enter.
    • Max Value: The maximum numerical value users are allowed to enter.
    • Step: Allows the users to enter specific legal number intervals.
  • Checkbox: This field allows you to add multiple choices that are displayed by checkboxes. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc. Click on Add option to add new options.
  • Radio: This field allows you to add multiple choices that are displayed by radio buttons. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide label, enable description, required, show in order, etc.
  • Select: This field allows you to add multiple choices for the users to choose from. The choices are displayed in a drop-down option and the user can only choose one of the choices. In the Field options, you’ll find the field settings such as field label, placeholder, and toggle button to hide the label, enable description, required, show in order, etc. Click on ‘Add option’ to add new options.

Text Fields #

  • Heading: The heading field allows you to add a heading or divide certain fields. In the Field options, you’ll find the field settings to insert the color, topography, Size default, Appearance, dimension, etc.
  • Paragraph: The paragraph field allows you to add a short description to the form. In the Field options, you’ll find the field settings to insert the color, topography, Size default, Appearance, dimension, etc.
Note: The option ‘Show in Order’ available in most of the fields. Enabling this option will show the respective field values on the Order Details.

WooCommerce Billing and Shipping Address Fields #

This category consists of the default billing and shipping address fields provided by WooCommerce. You can add these fields on the registration form just like other default/custom fields.

Settings #

Individual Form Settings #

While creating a registration form, you will find the form’s settings on the right sidebar. There are two tabs. Click on the Form tab to go to the settings.

This settings section includes the following:

  • Redirect URL: Add a URL to redirect the users after successful form submission.
  • Form Submit Button Text: Custom text to replace the submit button text.
  • reCaptcha v2 support: Enable this option to secure the registration form with the help of Google reCaptcha v2. Please make sure the required keys have been set on the Global Settings of this plugin.

Global Settings #

Go to Registration Forms > Settings to configure the global settings for the plugin. These settings will be applied across all the forms.

There are namely two settings available.

  • Sync Settings
  • General Settings

Sync Settings #

  • Replace WooCommerce Registration Form: Select the desired registration form that you have built to replace the default WooCommerce registration form. To replace the default form of WooCommerce, enable “Allow customers to create an account on the “My Account” page” under WooCommerce > Settings > Accounts & Privacy.

General Settings #

Here, you can add the necessary keys for activating the Google reCaptcha v2. To create the keys, refer to the official documentation of Google from here.

Registration Form for WooCommerce

Powered by BetterDocs