# Consent Form Builder: Sections and Page Controls

## Sections and Page Controls

### **Top Section**

Top section includes input fields and action buttons, each serving a specific purpose. Below is a detailed list of the available fields and buttons, along with their functions.

<figure><img src="/files/aKFx7IuXjBMdtMbMlcgE" alt=""><figcaption></figcaption></figure>

1. **Consent Form Name:** Enter a title in the field.
2. **Consent Form Type:** Enter or choose a type from the dropdown menu.
3. **Status:** Enable or disable the toggle switch to mark as active or inactive.
4. **Preview:** Click to display a preview of the created consent form. The preview includes a **Print** option to print the form directly.<br>

   <figure><img src="/files/883000Y399Ap6N6gFmfR" alt=""><figcaption></figcaption></figure>
5. **Save and Continue:** Save progress and keep editing.
6. **Save:** Store the form for future use.
7. **Cancel:** Discard changes and exit.

***

### **Form Editor**

This section allows users to design the layout and customize consent form pages. The rich text editor provides advanced editing features and various formatting options to create a well-structured and professional form.

#### Consent Form Page

Each segments of the page or sheet is explained in detail below, including its purpose and functionality.

1. **Page Header:** This section typically contains essential information, such as the healthcare facility's branding details, including the logo, address, and contact information. To manage the header image, hover over the header area to reveal icons for uploading, reverting, or deleting the image.

   <figure><img src="/files/gwKX4RK8c89kuyk2OXIF" alt=""><figcaption></figcaption></figure>

   ***Note:** Both the header and footer images must have a file size of **2482 pixels in width** and **318 pixels in height.***
2. **Consent Form Title:** This section is to enter the Consent Form Heading. This will be auto filled if the data is entered in **Consent Form Name** text field.

   <figure><img src="/files/FjXi7Vo8wcloT1lLAZZt" alt=""><figcaption></figcaption></figure>
3. **Main Content:** Type or paste the content into this section. Once added, the content can be formatted, edited, and customized using the rich text editor.

   <figure><img src="/files/riqxNUqyx6xJFQEogKK6" alt=""><figcaption></figcaption></figure>
4. **Footer:** Typically found at the bottom of the page, the footer might contain page numbers, copyright notices, or contact information.

   <figure><img src="/files/US8E3rFC0T1omwOD0qKI" alt=""><figcaption></figcaption></figure>
5. **Add New Page:** Users can insert a new page with a single click using the **+NEW SHEET** hyperlink available at the top and bottom of each page.

   <figure><img src="/files/FKjXVXmtQ0shNUrbFEIy" alt=""><figcaption></figcaption></figure>
6. **Delete Page:** A **Delete** icon is located near the top right corner of the page to remove it.

   <figure><img src="/files/3PYxPS8wuqlxXgKLrBkz" alt=""><figcaption></figcaption></figure>

#### Rich Text Editor

It includes options to change fonts, adjust alignment, set spacing, and more.

<figure><img src="/files/Vv3nN1nbnZDvzqZuFkyV" alt=""><figcaption></figcaption></figure>

***

### Layout Controls

This section provides design elements to structure the form:

<figure><img src="/files/JU0nvwcA1KcV96LPQFVB" alt=""><figcaption></figcaption></figure>

1. **Full Layout:** Click this option to insert a content section into the page. After inserting the section, hover over it to display the **Border**, **Move**, **Resize**, and **Delete** icons.

   <figure><img src="/files/5ByKnW2tioh1igjbI9rP" alt=""><figcaption></figcaption></figure>

   1. **Border** – Toggle this option to add or remove a border around the section.
   2. **Move** – Click this icon to select it. The mouse cursor changes to the move icon. Click and drag the section to the desired location.
   3. **Resize** – Click this icon to select it. Move the mouse cursor to the top or bottom edge of the section. Click and drag to adjust the section size.
   4. **Delete** – Click this icon to delete the section.
2. **Split Layout**: Use this option to create content in a split format or a bilingual consent form. Similar to the **Full layout** option, the **Border**, **Move**, **Resize**, and **Delete** controls function the same way.

   <figure><img src="/files/yB0mHSLoKirCdOJy11zf" alt=""><figcaption></figcaption></figure>
3. **Image Upload**: Use this option to insert an image into the consent form. Once uploaded, hover over the image to access the **Move**, **Resize**, and **Delete** icons.

   <figure><img src="/files/g4ioYq2vWFfMLOCQ0X7D" alt=""><figcaption></figcaption></figure>
4. **Vertical & Horizontal Lines**: Lines act as visual dividers that improve readability and organize content within the interface. They separate sections, enhance navigation, and create a clear, structured layout.
5. **Watermark**: Adds a background watermark for authenticity. After uploading the watermark, the **Opacity** (Transparent), **Location** (Arrows), **Zoom**, and **Delete** options are available to adjust the layout.

   <figure><img src="/files/QCLgNum62lMbfIOEjPHT" alt=""><figcaption></figcaption></figure>

***

### Form Variables

When a user fills out a digital consent form, some fields are automatically populated, while others require manual input. This happens due to **Form Variables** and **Form Controls**.

**Form Variables** automatically retrieve information from the application, such as the Patient's Name, Age, PIN etc. **Form Controls**, including text boxes and checkboxes, allow the user to enter information manually.

<figure><img src="/files/KwUjqL93ihdHj0xf4Pmx" alt=""><figcaption></figcaption></figure>

1. **Patient Details:** Includes patient-specific information such as Name, Age, PIN, and more. After inserting the variable, click on it to display additional controls, including Field Name, Font Size, Width, Height, Mark as Mandatory, and the Delete icon.

   <figure><img src="/files/1huf3DmKeVSwx5Lwfre4" alt=""><figcaption></figcaption></figure>
2. **Doctor Details:** Contains fields for the Doctor's Name, License, and Reference Doctor Name. After inserting the variable, click on it to display additional controls.
3. **Seals and Signatures:** Provides options for adding digital Seals and Signatures. After inserting the variable, click on it to display additional controls.
4. **Visit Details:** Captures appointment and visit-related information, including appointment date, visit date, etc. After inserting the variable, click on it to access additional controls.

***

### **Form Controls**

**Form controls** include input fields that allow users to enter information manually.

<figure><img src="/files/8Sg0HRLXVKAJ7NZCkUKD" alt=""><figcaption></figcaption></figure>

1. **Consent Heading**: To restore the section after deleting the title, select **Consent Heading** option.

   <figure><img src="/files/w6pmQPEAI3TFVLpnjyBt" alt=""><figcaption></figcaption></figure>
2. **Text Box:** A text box is an input field designed for entering information. After inserting the field, click on it to display additional controls, including Field Name, Font Size, Width, Height, Mark as Mandatory, and the Delete icon.

   <figure><img src="/files/gVGZZzKR8m7NeCxSjO2J" alt=""><figcaption></figcaption></figure>
3. **Text Area**: A text area is an input field designed for entering multiple lines of text, such as comments or descriptions. After inserting the field, click on it to display additional controls.
4. **Date Picker:** A date picker is an input field that enables users to select a date from a calendar. After inserting the field, click on it to display additional controls.
5. **Dropdown**: A dropdown is an input field that displays a list of predefined options, allowing users to select one. After inserting the field, click on it to access additional controls, including the option to add dropdown values.

   <figure><img src="/files/s1fmBpWslbyRf2dn3j70" alt=""><figcaption></figcaption></figure>
6. **Checkbox:** A checkbox is a form control that allows users to select one or multiple options by marking a box. After inserting the field, click on it to display additional controls.
7. **Time Picker:** A time picker is an interactive form control that enables users to select and input time details with precision.
8. **Radio Button:** A radio button is a form control that allows users to select only one option from a predefined set. After inserting the field, click on it to access additional controls, including the option to give group name.

   <figure><img src="/files/3FaHQzmZipjQEzP5Fbal" alt=""><figcaption></figcaption></figure>
9. **Signature Field**: A signature field is a form element that allows users to provide their digital or handwritten signature for authentication, consent, or approval. After inserting the field, click on it to display additional controls.
10. **Table**: A table is a form element that allows users to enter and organize data in a structured row-and-column format. After inserting the table, click it to access additional controls, such as inserting or deleting rows and columns.

    <figure><img src="/files/uzusrxJSBIHSRUWlDuU1" alt=""><figcaption></figcaption></figure>

***


---

# 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://unitecare.gitbook.io/uniteemr/master-modules/consent-form/consent-form-builder/consent-form-builder-sections-and-page-controls.md?ask=<question>
```

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.
