---
title: "Section settings in the editor"
description: "Configure a section, the container that groups the blocks shown together: a banner, a product grid, an intro block or a contact form."
url: https://docs.vivlab.com/en/editor/menu/section
---

# Section

The **Section** panel appears as soon as you click inside a section, outside any element. A section gathers the blocks that appear together (a banner, a product grid, a presentation block, a contact form…).

## Section

The **Section visible** option lets you temporarily hide a section without deleting it. Disable it to prepare content in advance or to remove a promotion temporarily without losing it. While it's hidden, a warning **The section is not visible to visitors** reminds you in the editor.

<DocsScreenshot name="editor-section-visibility" alt="The section visibility setting." :width="341" :height="61" />

## Automatic mobile layout

The **Automatic mobile layout** subsection generates the mobile layout of the section's blocks from their desktop organization. Click **Reorder elements**: only the mobile view is modified, the desktop view stays untouched.

<DocsScreenshot name="editor-mobile-organization" alt="Automatic element arrangement, available in mobile view." :width="341" :height="185" />

## Section style

The [style panel](https://docs.vivlab.com/en/editor/style/index.md) gathers the common formatting: [background](https://docs.vivlab.com/en/editor/style/background.md) (color, gradient or image), [inner spacing](https://docs.vivlab.com/en/editor/style/padding.md) and [border](https://docs.vivlab.com/en/editor/style/border.md). For a section, this is notably where you set the background color or load a banner image.