# SharinPix Form - Section
## Overview
{% hint style="info" %}
Sections are powerful layout elements that help administrators organize forms into clear, logical groups of related fields. A section can be added to a form through the [SharinPix Form Template Editor](https://docs.sharinpix.com/forms/form-elements/sharinpix-form-template-editor).
This documentation covers :
1. [The configuration options of the Section Element](#configuration-options)
2. [How to add questions in Sections](#adding-questions-to-a-section)
3. [The different display styles of Sections](#section-styles)
{% endhint %}
{% hint style="success" %}
Tips:
* Use Sections to break a form into clear, logical parts, such as **Personal Information** and **Inspection Details**.
* In longer forms, Sections make the layout easier to understand by grouping related fields and elements.
* **Sections** can be used to create Child Records on Salesforce. Refer to the documentation on [**Creation of Child Records With Form Sections**](https://docs.sharinpix.com/forms/form-sections-and-repeated-sections/create-child-records-with-form-sections) for more information**.**
{% endhint %}
## Configuration Options
### General Options
| Option | Description |
| ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------- |
| Label | Name of the section displayed to users. |
| Label Formula | Dynamically generate section titles based on values or conditions. |
| API Name | Unique identifier for referencing in logic or formulas. |
| Edit Section | Click to enter the section presented as a blank form template. Customize it by adding your elements. |
| Style | Choose a display style (e.g., Full Page/Collapsible/inline). |
| PDF Answer Column Labels | Option to display column labels when rendering the form in PDF. |
| Configure background color of the section title on PDF | Option to configure the background color of the section title in PDF. |
### Advanced Options
| Option | Description |
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Visible When | [Conditional visibility](https://docs.sharinpix.com/forms/form-elements/form-features-conditional-visibility) rule (show/hide based on formulas). |
| Pull data from a Salesforce record | Configuration for defining a mapping that will be used for prefilling the questions found inside the section using data from a Salesforce record. |
| Create a Salesforce record | Configuration for creating a Salesforce record using data from the section. Refer to [this doc](https://docs.sharinpix.com/forms/form-sections-and-repeated-sections/create-child-records-with-form-sections) for more information. |
| External field mapping | Option for specifying a question found in the section that will be used to store an external ID. This is useful for updating Salesforce records. |
## Adding questions to a section
To add questions to a section:
1. Click on the **Edit section** button on the Section element settings.
2. In the section editor, use the left sidebar to add the elements you want to appear in that section.
## Section Styles
A Section can be displayed in different styles. To configure the style of a Section element, use the **Style** option in the element’s settings.
### Full Page
The **Full Page** style is the default Section style. It displays the Section as a button. When the button is clicked, a new page opens and displays the elements contained within that Section. This is demonstrated below.
The image below shows all navigation options available in a **Full Page** section.
1. The **Exit Section** button closes the current section and returns the user to the parent **Full Page** section. If there is no parent section, the user is returned to the main form page.
2. The **Previous Section** button navigates to the previous **Full Page** section. If there is no previous section, it changes to a button that returns the user to the main form page.
3. The **Next Section** button navigates to the next **Full Page** section. If there is no next section, it changes to a button that allows the user to submit the form.
4. The **Navigation Menu** button opens the navigation menu.
The image below shows the navigation menu when opened.
It displays a list of all **Full Page** sections in the form and highlights the current section. Click any section in the list to navigate to it.
{% hint style="warning" icon="triangle-exclamation" %}
The navigation buttons in the bottom bar and the navigation menu are available only when the form contains **Full Page** sections.
{% endhint %}
### Inline
The **Inline** style displays the Section directly within the current form page. Instead of opening on a new page, the Section appears as a grouped container with its fields shown inside it.
{% hint style="success" %}
Tip:
This style is useful when you want to group related fields together while keeping them visible in the main form layout.
{% endhint %}
### Collapsible
The **Collapsible** style works like the **Inline** style by displaying the Section directly within the current form page. The difference is that a **Collapsible** Section can be expanded or collapsed, allowing users to show or hide the fields inside as needed.
## Demo: Building Inspection Form
The image below illustrates a form with an **Inline** section for general information and three **Full Page** sections for the building inspection. It also shows how users can use the navigation menu to open other page sections.
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.sharinpix.com/forms/form-sections-and-repeated-sections/sharinpix-form-sections-and-repeated-sections.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
.png?alt=media&token=5a80d924-59b9-45bf-916c-7d8499ab3454)
.png?alt=media&token=9e3ad6e1-85fc-4438-897c-8038892939b2)
.png?alt=media&token=d3bea8e5-0663-4225-89b1-9dc594015eda)
.png?alt=media&token=cfeb84d6-7aca-4e4b-b812-4ead600f876a)
.png?alt=media&token=5142ea8e-aa03-4952-9c0d-9c94f8e0dce7)
.png?alt=media&token=a35ca8d7-c849-47aa-8bf3-f86866b6c19b)
.png?alt=media&token=aa4183eb-72ce-4e27-92e8-2fdab19e1093)
.png?alt=media&token=6d76af6a-7581-4508-ac7d-220b3bcccdb8)
.png?alt=media&token=2b68a1e0-87a8-4dbe-bbd0-4d9fb0d737d4)
.png?alt=media&token=88b940c7-43b1-448a-94a6-1019640b6904)
.png?alt=media&token=a058000f-cbaa-492f-b0fd-48876c6e1667)
.png?alt=media&token=dfd705dd-8723-49f5-9467-a751c93d95e0)