Notice: There is no legacy documentation available for this item, so you are seeing the current documentation.
Would you like to create an affiliate registration form using Elementor? With AffiliateWP’s Elementor integration you can do just that, all without leaving the Elementor page builder.
This tutorial will show you how to set up the Elementor integration and create an affiliate registration form.
To build a custom affiliate registration form using Elementor you will need access to the Form widget. This is only available with Elementor Pro.
In This Article
- Enabling the Elementor Integration
- Adding the Form Widget and Customizing Fields
- Enabling Affiliate Registration
- Viewing an Affiliate’s Submitted Data
Enabling the Elementor Integration
To enable support for Elementor, go to AffiliateWP » Settings » Integrations. Enable the Elementor checkbox and click Save Changes.
Adding the Form Widget and Customizing Fields
Want a head start on building your registration form? Import our template file
To make it easier to build your affiliate registration form, we’ve created an Elementor page template. You can import this template into your site and start customizing.
Download the page template →
While editing your page with the Elementor page builder, locate the Form widget and insert it on to the page.
Once the Form widget has been inserted, a basic form will appear and the widget’s editing panel will be displayed.
Start by customizing the fields you’d like to show on your affiliate registration form.
For example, you might add some fields like the following:
The affiliate’s name.
The affiliate’s desired username.
The affiliate’s email address.
The affiliate’s payment email for systems such as PayPal, Moneybookers, or others.
A website where the affiliate intends to promote your site from.
How will you promote us?
How the affiliate intends to promote your business.
The affiliate’s password for their new account.
After you have finished adding/editing fields and customizing the styling it might look something like the following:
Enabling Affiliate Registration
Now we need to tell AffiliateWP that your form is an affiliate registration form.
Click on Elementor’s Actions After Submit section.
Once opened, click into the Add Action field (or alternatively, click the + icon) and select AffiliateWP from the list.
Once the custom action has been added, a new AffiliateWP section will appear in the panel below.
Click to open the AffiliateWP section and click the Enable Affiliate Registration toggle switch to turn on affiliate registration.
Next we need to map the fields. This lets AffiliateWP know which fields need to do specific tasks. We recommend mapping as many fields as possible.
To map the fields, choose a field from the select menu that matches the label on the left.
For example, when the Username field is mapped, the value of this field will be used for the affiliate’s WordPress username.
When the Password field is mapped, AffiliateWP will use that for the affiliate’s WordPress account password.
The selected field will be used to populate the user’s First Name and Last Name fields on the user profile screen.
Used for the affiliate’s WordPress Username.
Used for the affiliate’s WordPress account email.
Note: The Account Email field is the only required field. If no Username field is mapped, the Account Email will be used to generate an affiliate’s WordPress username.
Used for the affiliate’s Payment Email (if needed). This is shown on the affiliate’s edit screen within AffiliateWP.
The Website URL is shown while reviewing an affiliate. It’s also shown on an affiliate’s edit screen and on their WordPress user profile page.
The Promotion Method is shown while reviewing an affiliate. It’s also shown on an affiliate’s edit screen.
The Password field is used to generate a password for the affiliate’s WordPress user account. If no password field is mapped, a password will be automatically generated for the affiliate.
That’s it! You now have a custom affiliate registration form, created entirely in Elementor:
Viewing an Affiliate’s Submitted Data
While reviewing an affiliate’s application, you can see all the values from AffiliateWP’s mapped fields.
If your affiliate registration form has unmapped fields, they will be displayed in an easy to read table. Approving, or rejecting affiliates in AffiliateWP is a breeze.
If you want to review affiliate applications before affiliates become active, enable Require Approval from AffiliateWP » Settings » Affiliates.
After an affiliate has joined your affiliate program, their originally submitted data is always available. To see this, navigate to the main Affiliates screen at AffiliateWP » Affiliates and click on an affiliate’s name. All data mapped to AffiliateWP fields, and any custom data, will be shown on the screen: