In the following steps we will explain how to update or extend an existing contact form.

If you wish to create a complete new contact form, please do so by copying an existing form in your website (or add from the Template Library) as this already has the right styling settings. If you do not so, the contact form might not showcase in the right manner!


1. Open Contact Form

  • Login to your CMS and find the page – that holds the contact form you wish to edit – in the All Pages overview. Make sure this is the page in its default language (in most cases this is English)
  • Press Edit with Elementor. The page will open in the page builder.
  • Navigate to the contact form and right-click it > Edit
  • A menu opens on the left side which lets you edit the form. In the first dropdown part, you see an overview of all form fields.

2. The Basics

  • Form Name – Here you can update the name of the form.
  • Form Fields – A list of the fields in your form. You can duplicate, add or delete fields as you please. You can drag and drop to change their order.> Click on a field to view its settings. You can update the following items per form field:
  • Type – Choose the type of field you want (explained in chapter 3.2)
  • Label – The name of the field, displayed above the field in the form and on the email you receive from the user.
    • Most of the times these labels are not showcased in the frontend, as they hold placeholders. These are showcased in the field itself.
  • Placeholder – The frontend display name of the field.
  • Required – Switch it on to set the field as a Required field.
  • Column Width – Lets you set the width of the field. If you want a form with two fields in one row – set each field to 50%.

3. Edit & Add Form Fields

3.1 Update Existing Form Fields

  • Press the item, to unfold its details.
  • You can update or change all items explained above in the Content-tab. Please be aware not to change anything in the Advanced-tab as this is done by developers only.

3.2 Add New Form Fields

  • If the type of field you wish to add, already exists in the form, we recommend to duplicate this item. You can do so by pressing the folders-icon behind the name.
  • The duplicated item will appear underneath and you can now edit this accordingly.
  • You could also choose to add a new field by pressing Add Item underneath the last form field.
  • There are multiple options and type of form fields that you could add:
    • Text – A simple text field. i.e. Name
    • Email – An email type. Includes validation for email
    • Text Area – A textarea type. You can set the number of rows
    • URL – A website URL field
    • Tel – A telephone number type
    • Select – A select type. Dropdown list of options. Can set to multiple selection.
      • Add the question you want to showcase as the placeholder, as the first item in the list. After that, add each item the visitor can choose from per line.

    • Checkbox – A checkbox type. Check one or more options. You can slide the Inline List for a horizontal style.
    • Number – A number type, used for e.g. amount of persons. Lets you set a minimum and maximum amount.
    • Date – Add a date picker field.
      • Please aware that Elementor currently has a bug in its system so this field does not work at the moment. Choose a text field instead!
    • Time – Add a time picker field
      • Please aware that Elementor currently has a bug in its system so this field does not work at the moment. Choose a text field instead!
    • File Upload – Allow your users to upload files


4. Actions After Submit