To integrate with Divi, the InputWP plugin allows you to manually integrate an “Event” with a Divi theme-based form. This integration enables you to associate a date/time picker with a specific form field using a custom CSS selector. This way, you can enhance the user experience by providing advanced date/time selection capabilities within your Divi forms.
How to Use This Feature
- Accessing the Feature: To integrate an “Event” with a Divi form manually, follow these steps:
- Log in to your WordPress admin panel.
- Navigate to “InputWP” in the left-hand menu.
- Click on “Integration.”
- Under the “Form integration” section, click on “Add New” to create a new integration or edit an existing one.
- Selecting Manual Method:
- Provide a name for the integration using the “Label (Optional)” input field. This label helps you identify the integration.
- Select “Manual” from the “Method” select input field.
- Generating CSS Selector:
- Click the “Generate CSS Select” button. This will generate a CSS selector ID automatically.
- Edit the generated CSS selector ID in the “CSS Selector” text input field. Please note that if you’re integrating with Divi, you should remove the dot (“.”) before the code.
- Selecting Calendar:
- Use the “Select Calendar” select input field to choose the “Event” that you want to associate with the CSS selector.
- Editing CSS Class:
- The system will automatically generate a CSS class for the integration. Edit the CSS class using the “CSS Class” text input field to make it easily recognizable and relevant to your integration.
- Saving Changes: After editing the CSS selector, selecting the calendar, and updating the CSS class, scroll down to the bottom of the integration section and click the “Save” button to save the integration settings.
- Result: Upon saving, the date/time picker will be automatically injected into the form field defined by the custom CSS selector. This allows users to use the advanced date/time selection options associated with the selected “Event.”
Benefits of Integrating with Divi
- Flexible Integration: The manual integration method allows you to integrate the date/time picker seamlessly with Divi forms, providing advanced date/time selection capabilities.
- Enhanced User Interaction: By integrating a date/time picker, you enhance the user experience, making it easier for users to select dates and times within your Divi forms.
Using the manual integration to integrate with Divi, you can incorporate the capabilities of InputWP into your Divi forms and deliver a sophisticated form submission experience.