This guide will teach you how to seamlessly use Divi Builder with the User Registration & Membership plugin. This integration allows you to customize user registration, login, profile, membership, and other pages using Divi’s visual drag-and-drop interface, instead of relying only on shortcodes or default layouts.
- Prerequisite:
- Active installation of the User Registration & Membership plugin v4.1.4 or above.
- Active installation of the Divi Theme or the Divi Builder plugin (if you use another theme).
Installation and Activation #
- Install and activate the User Registration & Membership plugin
- Navigate to Plugins > Add New Plugin and search for “User Registration & Membership“. Next, click on Install and then the Activate button.
- Alternatively, navigate to Plugins > Add New Plugin > Upload Plugin. Now, upload the zip file for the plugin. You can download the zip file from the WordPress repository.
- Install and activate the Divi Theme/Builder.
- For the Divi theme, navigate to Appearance > Themes > Add New Theme > Upload Theme. Now, upload the Divi theme. It comes with Divi Builder, so you don’t have to install the plugin.
- If you want to use the plugin without the Divi theme, navigate to Plugins > Add New > Upload Plugin. Now, upload the Divi Builder plugin. (You can buy the Divi theme and builder from its official website)
Basic Integration Guide of Divi with User Registration and Membership Plugin #
Navigate to the Pages tab on your WordPress Dashboard and look for the page you want to edit with Divi Builder. Next, hover below the page’s name where you want to edit, and you’ll see the option that says Edit with Divi. Click on it and you can edit the page using the Divi Builder.
You can now hover over the page and explore the components provided by the Divi builder. Click on the blue color ‘+‘ sign to add a new section on your page.
Also, if you click on the green color ‘+’ sign, it will provide multiple options for row layout that you can insert.
Under the newly created row, click on the black color ‘+‘ sign to insert a module.
This integration provides a dedicated module for the User Registration & Membership plugin. So, you can now scroll down and select modules offered by the User Registration & Membership plugin. These modules usually start with URM in their names.
Configure Module Settings #
After selecting the module, a pop-up will appear, allowing you to choose between the pages, components, or forms you have created.
For example, if you select the URM Registration Form, you can choose which form to appear on this page and also select the user’s state. These options vary based on the module you have chosen.
Now, you can move to the Design tab and modify the module’s design.
Similarly, you can customize it using the Advanced tab. You can add changes like CSS ID & Classes, Custom CSS, Transitions, and more.
Once you complete the customization, click the green tick to save the changes. Other options include deleting, redoing, and undoing the changes.
Next, you can duplicate the module to add the same module on your page twice. Also, you can add this module to your library by naming it, adding it to categories, and adding it to tags.
You can save and exit the page after setting it up. For more settings options, read Divi Builder’s official documentation.
Also, upgrade to User Registration & Membership Pro to use additional integrations like WooCommerce, Zapier, and more.
