> For the complete documentation index, see [llms.txt](https://aries-theme.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aries-theme.gitbook.io/docs/theme-settings/layout.md).

# Layout

Layout controls your store’s page width and spacing so pages feel clean and easy to read. It helps content breathe, improves scanning, and keeps things consistent on desktop and mobile.

<figure><img src="https://2498163780-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F2LxG3rPCoA6sZo7ovFkR%2Fuploads%2Fy4aEKuo5LhrCZ27UGGj8%2FCapture%20d'%C3%A9cran%202025-09-01%20200538.png?alt=media&amp;token=de186af0-eaf9-4d45-8ee7-ea2b82d548b9" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}

#### How to set it up

* Go to **Online Store** > **Themes** > **Customize**.
* Open **Theme settings** > **Layout**.
* Make your changes, preview live, then click **Save**.
  {% endhint %}

### Settings

* **Page width**: Controls the maximum width of your page content. Wider fits more on screen; narrower improves focus and readability.
* **Space between template sections**: Adjusts the vertical space between sections. More space feels airy; less space feels compact.

#### Grid

* **Horizontal space**: Sets the gap between columns in grids (e.g., product cards side by side). Affects how dense or open your layouts feel.
* **Vertical space**: Sets the gap between rows in grids. Helps balance scrolling comfort and information density.

***

### **Tips**

Keep page width comfortable for reading (not too wide), and use consistent spacing to create rhythm. Preview on desktop and mobile; extreme spacing can break layouts or feel cramped.