Sidebar settings can’t hold a value and aren’t configurable. They’re informational elements that can be used to provide detail around your input settings and organize them.

Sidebar settings are composed of [standard attributes](#standard-attributes). The following are the types of sidebar settings:

  - [header](#header)
  - [paragraph](#paragraph)

> Tip:
> If you want to add input settings, like a checkbox, then refer to [Input settings](/docs/storefronts/themes/architecture/settings/input-settings).

## Standard attributes

The following are standard attributes across sidebar settings:

<table>
  <thead>
    <tr>
      <th>Attribute</th>
      <th>Description</th>
      <th>Required</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <code>type</code>
      </td>
      <td>
        The input setting type, which can be either <a href="#header">header</a> or <a href="#paragraph">paragraph</a>.
      </td>
      <td>
        Yes
      </td>
    </tr>
    <tr>
      <td>
        <code>content</code>
      </td>
      <td>
        The setting content, which will show in the theme editor.
      </td>
      <td>
        Yes
      </td>
    </tr>
  </tbody>
</table>

## header

A setting of type `header` outputs a header element to help you better organize your input settings. In addition to the [standard attributes](#standard-attributes) of a sidebar setting, `header` type settings have the following attribute:

<table>
  <thead>
    <tr>
      <th>Attribute</th>
      <th>Description</th>
      <th>Required</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <code>info</code>
      </td>
      <td>
        An option for informational text about the setting.
      </td>
      <td>
        No
      </td>
    </tr>
  </tbody>
</table>

For example, the following setting generates the following output:
```json
{
  "type": "header",
  "content": "Email Signup",
  "info": "Subscribers added automatically to your “accepted marketing” customer list. [Learn more](https://help.shopify.com/manual/customers/manage-customers)"
}
```

<p>
<div class="react-code-block" data-preset="output">
<div class="react-code-block-preload ">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">

</div>
</div>


<script type="text/plain" data-image="/assets/themes/header-setting-with-info.png">header setting</script>

</div>
</p>


## paragraph

A setting of type `paragraph` outputs a text element to help you better describe your input settings. For example, the following setting generates the following output:

```json
{
  "type": "paragraph",
  "content": "All of your collections are listed by default. To customize your list, choose 'Selected' and add collections."
}
```

<p>
<div class="react-code-block" data-preset="output">
<div class="react-code-block-preload ">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">

</div>
</div>


<script type="text/plain" data-image="/assets/themes/paragraph-setting.png">paragraph setting</script>

</div>
</p>


## Create links

You can [add links](https://www.markdownguide.org/basic-syntax/#links) to the `info` settings attribute by enclosing the link text in brackets and then following it immediately with the URL in parentheses.

For example, the following setting generates the following output:

<p>
<div class="react-code-block" data-preset="file">
<div class="react-code-block-preload ThemeMode-dim">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>
<div class="react-code-block-preload-code-container">
<div class="react-code-block-preload-codeline-number"></div>
<div class="react-code-block-preload-codeline"></div>
</div>

</div>
</div>

<script data-option="filename" data-value="Settings"></script>

<script type="text/plain" data-language="json">
RAW_MD_CONTENT{
  "type": "checkbox",
  "id": "enable_payment_button",
  "label": "Show dynamic checkout button",
  "info": "Each customer will see their preferred payment method [Learn more](https://help.shopify.com/manual/online-store/dynamic-checkout)",
  "default": true
},
END_RAW_MD_CONTENT</script>

</div>
</p>


<p>
<div class="react-code-block" data-preset="output">
<div class="react-code-block-preload ">
<div class="react-code-block-preload-bar "></div>
<div class="react-code-block-preload-placeholder-container">

</div>
</div>


<script type="text/plain" data-image="/assets/themes/create_links_input.png">link setting</script>

</div>
</p>