In this documentation, we will show you how to customize the User Register widget presented by Element Pack Pro.

Inserting The User Register Widget

Inserting the widget by following this,

1. Search by the User Register widget name.
2. Then select the appear widget ( with Element Pack Pro logo T.R corner).
3. After Drag and Drop it on the Elmentor Editor page.

Content Tab

The Content tab controller displayed here offers the flexibility to adjust the layout of the widget according to your preferences.

Forms Layout Section

Go to Content > Forms Layout

Make this forms layout by following this,

1. Skin: Set the skin for the forms.
2. Label: Enable the switcher to show the Label.
3. Input Size: Set the input size.

Submit Button

4. Text: Set the text for the submit button.
5. Size: Set the size of the button.
6. Alignment: Set the alignment for the button.

Additional Options

Go to Content > Additional Options

1. Redirect After Register: Enable the switcher to redirect the page.
2. Set URL: Set the url for the redirecting page.
3. Auto Login After Register: Enable the switcher to login automatically login.
4. Lost your Password?: Enable the switcher to show the Lost password.

5. Login: Enable the switcher to Show login.
6. Logged in Message: Enable the switcher to show the logged in message.

7. Add Password Field: Enable the switcher to add the password field.
8. Confirm Password Field: Enable the switcher to show the confirm password field.
9. Show Password Strength: Enable the switcher to show the password strength.
10. Must Strong Password: Enable the switcher to show the must password.

11. Remove First Name: Enable the switcher to remove the first name.

12. Remove Last Name: Enable the switcher to remove the last name.

13. Custom Label: Enable the switcher the custom label.

14. Additional Button Message: Enable the switcher to show the additional button message.
15. Additional Message: Set the additional Message.
16. Show reCAPTCHA Checker: Enable the switcher the to show the recaptcha.
17. Toggle Password: Enable the switcher to toggle password.

Style Tab

Provide the controller to make the visual appearance or presentation of the tabs. This includes aspects that are visually appealing and cohesive with the overall design of the interface.

Form Style Section

Go to Style > Form Style

Make the style section customizable by following,

1. Rows Gap: Set the row gap between the labels and input.
2. Color: Set the color for it.
3. Hover Color: Set the hover color.
4. Typography: Set the typography for it.

Label Section

Go to Style > Label

Make the label stylish by following,

1. Spacing: Set the spacing for the labels.
2. Text Color: Set the text color.
3. Typography: Set the typography for it.

Fields Section

Go to Style > Fields

Normal State for Fields

Make the fields section stylish by following,

1. Text Color: Set the text color for it.
2. Placeholder Color: Set the placeholder color.
3. Background Color: Set the background color.

4. Border Type: Set the type for the border.
5. Border Width: Set the width for the border.
6. Border Color: Set border color.
7. Border Radius: Set the radius for the border.

8. Padding: Set the padding for the fields.
9. Typography: Set the typography.
10. Box Shadow: Set the shadow for the box.

Hover State for Fields

The changes appear

11. Text Color: Set the text color for the fields.
12. Placeholder Color: Set the placeholder color.
13. Background Color: Set the background color.
14. Border Color: Set the border.

Submit Button Section

Go to Style > Submit Button

Normal State for User Register

Set the submit button stylish by following it,

1. Color: Set the color for the submit button.
2. Background Color: Set the background color.
3. Border Type: Set the border type.
4. Border Width: Set the width for the border.

5. Border Color: Set the border color for button.
6. Border Radius: Set the border radius.
7. Padding: Set the padding.

8. Margin: Set the margin for button.
9. Typography: Set the typography.
10. Box Shadow: Set the box shadow for the submit button.

Hover State for User Register

11. Color: Set the color for the hover state.
12. Background Color: Set the background color.
13. Border Color: Set the border color.

14. Box Shadow: Set the shadow for the box.
15. Animation: Set animation for submit button.

Additional Section

Go to Style > Additional

Make the additional section interactive by following,

1. Color: Set the color for it.
2. Additional Message Typography: Set the typography for the additional message.

Toggle Password Section

Go to Style > Toggle Password

Make the stylish for the toggle password,

1. Color: Set the color for the toggle password.
2. Size: Set the size of it.

Video Assist

You can watch the video above to learn about the Search widget.
Please visit the demo page for examples.

Thanks for staying with us.