---
title: "The structure elements"
slug: "the-structure-elements"
abstract: "Add sections, pages, and submit button to your forms."
---
# The structure elements

The Sitecore Forms application groups the elements to help structure your forms in the **Structure** section of the **Form elements** pane.

<details>
<summary><h2>Section</h2></summary>

Use the Section element to divide the form into sections.

| **Section** | **Item** | **Description** |
| --- | --- | --- |
| Details | Field name | Name of the element. Always use meaningful names for the Field name. The Field name is the actual Item name for the Sitecore definition item for the form field. |
| Conditions | Edit conditions | Apply conditional actions to fields in web forms. Click **Edit conditions** to add a condition. |
| Styling | CSS class | Define the CSS class of the field. |

</details>

<details>
<summary><h2>Page</h2></summary>

If you want to create a long form with multiple sections, you can use the Page element to create a form that contains multiple pages and make it more user-friendly.

The Page element has only one setting: the name of the element.

</details>

<details>
<summary><h2>Submit button</h2></summary>

Use the submit button for navigation (previous and next buttons), to submit the form, and/or to trigger submit actions. You can add different types of actions to all submit buttons. For example, the submit action **Save data** added to the next button makes sure the data is saved to your database when a contact clicks **Next** to move on to the next page of the form.

| **Section** | **Item** | **Description** |
| --- | --- | --- |
| Details | Label | Name the button. For example: Continue/Next, Previous, Submit. |
|  | Field name | Name of the element. |
|  | Navigation step | Determines what happens after clicking the **Submit** button. The options are **Submit**, **Previous**, or **Next**. |
| Styling | CSS class | Defines the CSS class of the field. |
| Conditions | Edit conditions | Apply conditional actions to fields in web forms. Click **Edit conditions** to add a condition. |
| Submit actions | Delete the submit action | Deletes a submit action. |
|  | Modify the submit action | Opens a submit action for modification. |
|  | Move the submit action one step up | Moves the submit action one step up in the list. |
|  | Move the submit action one step down | Moves the submit action one step down in the list. |
|  | Add a submit action | Click Add (+) to add one of the following [submit actions](https://doc.sitecore.com/xp/en/users/102/sitecore-experience-platform/working-with-submit-actions.html):<br><br>**Trigger Goal** – selects a preset goal.<br><br>**Trigger Campaign Activity** – selects a preset campaign activity.<br><br>**Trigger Outcome** – selects an outcome type.<br><br>**Send Email Campaign message** - select the [email campaign message](https://doc.sitecore.com/xp/en/users/exm/102/email-experience-manager/send-an-automated-email-campaign-upon-form-submission.html) that should be sent when the button is clicked.<br><br>**Redirect to Page** – redirects the visitor to a web page.<br><br>**Save Data** – saves the form data to the database.<br><br>> [!note]<br>> If you add more than one submit action, the order is important. For example, if you place a redirect action before a save action, the form data may not be saved. |

</details>