# Creating and editing a template section

!!!info
Templates are made up of **Sections** that display one or more related fields of data. You’ll see these sections as headings within your template, and in the left-hand navigation of your template
!!!

<div>
  <script async src="https://js.storylane.io/js/v2/storylane.js"></script>
  <div class="sl-embed" style="position:relative;padding-bottom:calc(46.19% + 25px);width:100%;height:0;transform:scale(1)">
    <iframe loading="lazy" class="sl-demo" src="https://app.storylane.io/demo/tcdod0uobypb?embed=inline" name="sl-embed" allow="fullscreen" allowfullscreen style="position:absolute;top:0;left:0;width:100%!important;height:100%!important;border:1px solid rgba(63,95,172,0.35);box-shadow: 0px 0px 18px rgba(26, 19, 72, 0.15);border-radius:10px;box-sizing:border-box;"></iframe>
  </div>
</div>

---

When you open the editor, you will first see a list of the template’s Sections. 

To edit an existing section, click on it. To create a new section, click on Add Section. There are three elements at the top:

- Use the **Tickbox** to determine whether this section should be displayed in the left hand navigation for the template.
- Use the **Label** field to give the section a label for the left hand navigation
- Enter a number in the **order** field to determine where in the template this section appears. 1 will be above 2, which will be above 3, etc.

Choose a **Layout** for your section. This determines how the section appears in the template. There are three elements of the layout:

- **Design** (options: Block, Card, List, Tab, Gallery, Search) determines the basic shape of this section
- **Content Direction** (options: Column, Row) determines whether your data is read top to bottom or left to right
- **Container** (options: Yes, No) determines whether a clear white box appears as the boundary of this section

Choose a **Header** for your section. Use the **Static Value** tab which is selected by default. There are three elements of the header:

- **Value** is text that appears at the top of the section
- **Semantic Element** is the heading level for the header (Heading 1 is most prominent)
- **Tooltip** can be used to give a description for the section that’s available as a tooltip (which will appear when you hover a mouse over the templated content).

Then choose the **content** that you wish to display in your section. There are four elements of the content:

- **Path Type** (options: Relative, Linked, Base, Search) typically defaults to Relative
- **Data Path** is the data that you want to display. Begin with an @ or a letter for autocomplete. You can also look at your indexed data in the other options tab at this point 
- **Separate Child Content** (options: no, dashed, and solid divider) determines how rows or columns within this section are separated 
- **Additional **Styling (options:scrollable, section, bottom-padded) gives you other options for the appearance of the data.

Then click **Save** to save your choices so far. You’ll then see your section as saved.

!!!info
Choosing a path type

A **Relative path** looks for data relative to the path value specified in the parent of the item that you’re working on. In a section it’s relative to the template itself, so you might choose ‘name’. In the metadata (below) it’s relative to the section, so you might choose ‘value’.

A **Link path** looks for data from a linked record. If the parent section is pointing at some metadata that represents a 'reference link', selecting a link path will pull data from the linked record, relative to the base of that record, so you might choose ‘name.value’

A **Base path** is relative to the base of the active record, and ignores anything in parent items. So you might choose ‘name.value’.

A **Search path** generates a search within a record and is documented separately.
!!!