Form

The Elementor Addon Elements is a powerful plugin that enhances the functionality of Elementor’s Form widget in our pro version. With this plugin, you can create a new post in your chosen custom post types when a user submits the form. Let’s talk about the new features that we added to Elemento’s Form that make your forms even better.

Explored Added Functionality to Elementor Form

A powerful addition is the “Taxonomy” option under the form field type. It simplifies the process of displaying or mapping form data to taxonomy and custom fields. With these user-friendly additions, Elementor Addon Elements takes your form creation and post-generation experience to a new level.

Taxonomy Field Type

Start by selecting the field type as Taxonomy under the Form Field Section Settings.

• Type: Select type as taxonomy.
• Label: Enter the label.
• Required: Enable the option to make it necessary.
• Select Taxonomy: Select the taxonomy that you want to show.
• Select Field Type: Select field type as radio, checkbox, or multiple selection.
• Inline List: Enable the option to display values in an inline order.
• Column Width: Select the width of a column.

EAE – WYSIWYG Field Type

The next update we added is a new field type called “EAE—WYSIWYG” to the form field types. This feature makes it easy for users to enter and format text, making the process more enjoyable and user-friendly.

Here’s how to use it:

• Type: Select type as EAE – WYSIWYG.
• Label: Enter the label.
• Required: Enable the option to make the field mandatory.
• Rows: Specify the number of rows for the text editor.
• Column Width: Enter the width of a column.

EAE – Dynamic Upload Field Type

In the next update, we’re adding a new field type called EAE—Dynamic Upload. This feature allows users to upload media directly through the form. Additionally, users can preview featured images that have already been uploaded to a post, page, or other content. These previews can be opened in a lightbox for a closer look, making it easier to review and update content.

This update is particularly useful when you want to refresh a post with new details, ensuring that your content stays current and visually engaging.

To do this, choose the field type EAE-Dynamic Upload and make changes in their settings.

• Type: Select type as EAE – WYSIWYG.
• Label: Enter the label.
• Required: Enable the option to make it necessary.
• Max File Size: Select the maximum file size.
• Allowed File Types: Enter the file types that you’re allowed to upload.
• Multiple Files: Enable the option to upload multiple files.

Uploaded Media

• LightBox: Choose the option to display an already uploaded image in lightbox form.
• Width: Enter the width of image preview.

• Column Width: Enter the column width.

Create/Update Post

Next, we added a new option called “Create/Update Post” in the Action After Submit settings. This feature allows you to create a new post or update an existing one with the details submitted through the form. It seamlessly integrates with Advanced Custom Fields (ACF), so you can display dynamic data in your posts.

To use this feature effectively, make sure you choose the Create/Update Post option and have already set up your taxonomies, terms, custom fields, and post types in ACF. This will help you organize and display the data as needed.

After selecting the Create/Update Post option, a new “Create/Update Post” control is displayed. Users can effortlessly choose whether to update or create a post and display data either using shortcodes or manually inserting it. The flexibility extends to assigning multiple or single categories and taxonomies directly through the form. Additionally, users can insert form field data into custom fields for more personalized content.

Below are the settings of Create/Update post:

• Mode: Choose either create or update post.
• Post Type: Select the post type in which you want to create posts.
• Post Status: Select the created post status.
• Post Title: Enter the post title manually or use a shortcode. Check here to learn how to find a shortcode.
• Post Content: Enter the post content manually or use a shortcode.
• Post Thumbnail: Enter the shortcode of a thumbnail image.

• Post Categories: Add the post categories using the Add Item button.
  • Category Slug: Enter the slug of the category.

• Post Taxonomy: Add the post taxonomies using the Add Item button.
  • Taxonomy Slug: Enter the slug of the taxonomy.
  • Term: Enter the name of the taxonomy term manually or use the shortcode that you find in the advanced settings of the taxonomy form field.

• Custom Fields: Add the custom fields using the Add Item button.
  • Field Name: Enter the field name that you created using ACF.
  • Field Value: Enter the shortcode for the field value manually or use the shortcode that you find in the advanced settings of a particular form field.

Display Post Data in Specific Form Fields

The settings remain the same when creating or updating posts with Elementor forms. However, when you choose to update a post, you can display previously uploaded data in the form fields by selecting the dynamic value in the Advanced section. For fields like Taxonomy and EAE—Dynamic Upload, you don’t need to choose a dynamic value, as they automatically retrieve it.

For instance, if you want to display the post title, you can choose a dynamic value specifically for that, as shown in the screenshot. We’ve also added a new dynamic field called “EAE – Post Content.” This field lets you set a default value for the post’s description, ensuring your posts are consistent and accurately reflect the information submitted through the form.

Once you select the default values for all fields, the form will display the previously uploaded data in each field. This allows users to see and edit their previous entries, making it easier to update or correct information.

How to Find Shortcode for Fields

To get the shortcode of your form fields, follow these steps:

• Go to the advanced settings of your form fields by clicking on Form Fields ➝ Advanced.
• Look for the Shortcode option, copy the shortcode, and paste it where you need it.

Take a look at our in-depth guide on using the new features of Elementor’s Form.