Elementor Form Builder Addon

Introducing the Modern Event Calendar Elementor Form Builder Addon – your gateway to crafting unparalleled ticket styles that align perfectly with your event site’s aesthetics. This innovative addon, seamlessly integrated with Elementor Page Builder, offers a highly personalized experience tailored to your unique preferences. Elevate your event presentation with custom-designed tickets, showcasing your distinct style effortlessly. The Elementor Form Builder Addon is not just an enhancement; it’s a new standard for precision and creativity within the MEC plugin.

Elementor Form Builder Addon Preparation

Installation

In the first step, Ensure that both the Modern Events Calendar and the Elementor Form Builder Addon are installed and activated.

Adjusting Form Builder Post Type

To configure Elementor with the MEC Form Builder post type, please head over to Elementor > Settings > General and enable the Form Builder post type.

Now, you can set different templates for the ticket’s booking form and then set them for all the tickets or only for a certain one.

Elementor Form Builder Addon Settings

To create your first form, go to MEC > Form Builder, click on the Add New With Elementor button, create a new template, and open it with Elementor.

Creating a form template

Now, you will then be redirected to Elementor Page Builder. Then, find “MEC Form Builder” and place it in one of the sections.

Click “Add Item” and add fields to the form. Then, you can set the field type for this particular field.

Field Type

You can choose your preferred field type from the various types that have been prepared for you.

Field Map

Also, you can map each field to the listed field. For example, here we choose the billing address from Woocommerce:

Required Field

Define which fields to be mandatory for users to fill.

Label

Set a label for the created field.

Placeholder

Set a placeholder for the created field.

Fields Width

There’s also another option with which you can divide the width of the field. To do this, simply use these options:

Half-Width
This option enables your form to have two columns, and the fields will be placed in pairs next to one another.

Third-Width
This option enables your form to have three columns, and the fields will be placed in pairs next to one another.

Single-Line
This option enables your form to have controls in a single row.

You can see the info on the front end of the booking form(single event page).

Note: You can rearrange the fields by dragging and dropping them up and down.

Styling Forms

In the style tab, you can use your imagination and design the form however you desire, with no limitations to sync your website color palette and design.

---

Now, you can publish the form. Head over to the dashboard and enable this form for your desired event.

Assigning Elementor Form Builder

There are two ways to assign the designed form: globally or to a specific event.

Assigning Booking Form Globally

If you want to use the same booking form design for all your events, navigate to MEC Settings > Booking > Booking Form. Then, choose the Elementor form Builder radio button and select your designed template from the dropdown.

Now, the design you have created will be implemented for all your event bookings.

Assigning Booking Form Individually

To enable the form in the back-end of an event with a ticket, you need to uncheck the box for “Inherit from global options” in MEC Settings > Booking Form.

Now, you have two options to choose your form.

1- You can use the traditional method and create your form in MEC Settings > Booking Form, which has the default style.

2- You can also click on “Elementor Form Builder” and select the desired form that you created before by simply selecting it from the drop-down menu.

Complete the purchase, and then the form you have created will be available there. Check the form to make sure everything you created with the Modern Events Calendar from Builder Addon is working accordingly.

For the file’s fields, you need to make some adjustments.

The size of the file to upload is set by the php.ini file, which is the file handling your site’s server: upload_max_filesize on the php.ini file. For more information, please contact your host provider.

Important Notes:

1. You can create a separate form for each event.
2. Both the classic form builder and the Elementor form builder addon can be configured.
3. For a classic form, go to MEC Settings > Booking > Booking Form, and you have the option to set a global form for all your events, or you can customize your very own form from the event’s editing page. Or skip all that and create your very own forms using the Elementor addon.

FAQ

01. What do I do when I get the Error 500 screen on Elementor’s editor?

Make sure to use the latest version of the add-on and check your server’s configuration with the help of this post. If that doesn’t help, make sure to contact us, and we’ll help you out. 

02. I want to translate the Elementor Form Builder Addon. How can I do that?

Make sure to read this post on how to translate: https://webnus.net/dox/modern-events-calendar/translate-mec.

03. Does the Elementor Form Builder Addon work with MEC Lite?

No, that’s because Form Builder utilizes the booking feature that is exclusive to MEC Pro and not available in MEC Lite.

04. How can I create a form that is exclusive to a ticket?

You can’t create forms exclusive to specific tickets, but you can make a specific form for each event.

05. Can I use the classic form together with the Elementor Form Builder Addon?

Yes, but you can use one or the other. They can’t be used at the same time in an event.

06. I’ve installed the add-on, but I get an error when I try to access the Elementors editor.

Please go to WordPress Dashboard > Settings > Permalink and set your website’s permalinks on the Post name. Afterward, the editor will become functional.