# Block configuration

ThemeWare® extends selected CMS blocks with a **block configuration** in the CMS sidebar (2). The block configuration allows you to control the responsive behaviour of your CMS blocks conveniently - without having to enter CSS classes manually.

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

The configuration is divided into two areas: the **Responsive block layout** (3 – gutter and alignment) and the **Responsive column layout** (4 – column arrangement, visibility and expert mode).

{% hint style="success" %}
This is the first version of this feature. We already have some ideas for further configurations, but we’d like to focus on your feedback on the current version first.

**Tip**: Do you have any suggestions for further configurations or other features for ThemeWare®? If so, please feel free to send us your ideas at any time via the ThemeWare Service Portal:

* [Suggestion for improvement (Feature request)](https://service.themeware.design/en/feature-request)
  {% endhint %}

{% hint style="warning" %}
**Important**: This feature is only available in the ThemeWare® Pro Edition.
{% endhint %}

***

## Responsive block layout

In the "Responsive block layout" (3) section you configure the gutter and the alignment of the columns within the block.

> **Gutter**
>
> Sets the horizontal and vertical gap between the columns. You can choose from various predefined spacing values or "Default".
>
> **Alignment**
>
> Select the horizontal alignment of the columns within the row:
>
> * **Default (left)** - Default alignment
> * **Center** - Columns are centered
> * **Right** - Columns are right-aligned
> * **Space between** - Equal space between the columns
> * **Space around** - Equal space around the columns
> * **Space evenly** - Fully evenly distributed space

### Advanced configuration

With the "Advanced configuration" toggle you can configure gutter and alignment individually for each viewport. The following viewports are available:

* **Desktop Large** (≥1200px)
* **Desktop** (≥992px)
* **Tablet** (≥768px)
* **Mobile Landscape** (≥576px)
* **Mobile Portrait** (<576px)

{% hint style="info" %}
**Note**: Without the advanced configuration the values apply equally to all viewports.
{% endhint %}

***

## Responsive column layout

In the "Responsive column layout" (4) section you configure the column arrangement and visibility of the individual columns.

> **Column arrangement**
>
> Sets how many columns are displayed side by side instead of stacked in a specific viewport. For example, you can reduce three columns to two on a tablet.
>
> **Visibility**
>
> Controls whether a column is visible or hidden in a specific viewport.
>
> **Asymmetric from**
>
> Only available for asymmetric column blocks (e.g. Two columns 3-9, Three columns 3-3-6). Sets from which viewport the columns are displayed in the predefined asymmetric layout of the block. Below this viewport the columns are arranged equally or stacked.
>
> **Expert mode**
>
> Allows manual CSS class input per column (e.g. `col-12 col-md-6`). The expert mode overrides the column arrangement and visibility configuration.

### Advanced configuration

With the "Advanced configuration" toggle you can set column arrangement and visibility individually for each viewport.

{% hint style="info" %}
**Note**: Without the advanced configuration the values apply equally to all viewports.
{% endhint %}

***

## Supported blocks

Not all CMS blocks support all areas of the block configuration. The following overview shows which block types offer which configuration areas:

### Column blocks (symmetric)

Symmetric column blocks such as "Two columns", "Three columns", "Four columns" and "Six columns" support:

* Responsive block layout (gutter + alignment)
* Responsive column layout (column arrangement + visibility)

### Asymmetric column blocks

Asymmetric column blocks such as "Two columns 3-9", "Two columns 4-8", "Three columns 3-3-6" etc. support:

* Responsive block layout (gutter + alignment)
* Responsive column layout (column arrangement + visibility + asymmetric from)

### Grid blocks

Grid blocks such as "Grid One", "Grid Two", "Grid Modern" etc. support:

* Responsive block layout (gutter only, no alignment)

### One column

The "One column" block supports:

* Responsive column layout (column arrangement + visibility, no gutter, no alignment)

{% hint style="success" %}
**Tip**: Do you have any suggestions for further configurations or other features for ThemeWare®? If so, please feel free to send us your ideas at any time via the ThemeWare Service Portal:

* [Suggestion for improvement (Feature request)](https://service.themeware.design/en/feature-request)
  {% endhint %}


---

# 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://docs.themeware.design/additional-features/cms-extensions/cms-blocks/block-configuration.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.