# Simple - Banner

This element is a powerful tool to guide users to specific actions. It helps you draw attention to important calls to action and increases visitor engagement.

Whether it's subscribing to a newsletter, purchasing a product, linking to a category, or filling out a form—the CTA banner ensures that the desired action is presented clearly and appealingly.

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

### General Configuration

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

<table><thead><tr><th width="258">Function</th><th>Description</th></tr></thead><tbody><tr><td>Element Type (1)</td><td>Call-to-Action = Custom Link<br>Category = Category Link<br>Custom HTML = Custom Code in HTML / Twig Editor</td></tr><tr><td>Custom Media (2)</td><td>If set, a custom background image can be applied. Otherwise, it checks if a category image has been set.</td></tr><tr><td>Enable Video (3)</td><td>Allows placing a background video</td></tr><tr><td>Fixed Background (4)</td><td>Similar behavior to <a data-mention href="/pages/75bmoK2J0tnetiLDtwox">/pages/75bmoK2J0tnetiLDtwox</a></td></tr><tr><td>Activate Call-to-Action (5)</td><td>If disabled, no link will be set</td></tr><tr><td>Entire Element Clickable (6)</td><td>If enabled, the entire banner is linked, not just the button</td></tr><tr><td>Open Link in New Tab (7)</td><td>The link will open in a new browser tab</td></tr><tr><td>Show Button (8)</td><td><a data-mention href="/pages/IDCzxbLczQ60ESEzaHLK">/pages/IDCzxbLczQ60ESEzaHLK</a></td></tr></tbody></table>

### Media Configuration

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

{% hint style="info" %}
Here you can upload images or videos.
{% endhint %}

### Category Configuration

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

<table><thead><tr><th width="306">Function</th><th>Description</th></tr></thead><tbody><tr><td>Activate Category Title (1)</td><td>The title is automatically taken from the assigned category</td></tr><tr><td>Category Description (2)</td><td>The description of the category if maintained in the category</td></tr><tr><td>Caption Box - Width (3)</td><td>Maximum width of the box that provides the content. This is important for line breaks.</td></tr><tr><td>Max. Characters of Description (4)</td><td>You can limit the description here. Overflow will be displayed with "..."</td></tr><tr><td>Color Settings (5)</td><td>Ensure a high-contrast color scheme</td></tr></tbody></table>

### Layout Configuration

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

<table><thead><tr><th width="264">Function</th><th>Description</th></tr></thead><tbody><tr><td>Vertical Alignment (1)</td><td>The vertical positioning of the content box within the element</td></tr><tr><td>Horizontal Alignment (2)</td><td>The horizontal positioning of the content box within the element</td></tr><tr><td>Text Alignment (3)</td><td>Left-aligned, centered, or right-aligned</td></tr><tr><td>Set Dimensions (4)</td><td>Here you can make size configurations. Ensure a good interplay of background, size of the element, and amount of content.</td></tr><tr><td>Font Sizes (5)</td><td><a data-mention href="/pages/ZJ9dlvURdA2KvrRvb6W0">/pages/ZJ9dlvURdA2KvrRvb6W0</a></td></tr></tbody></table>

### SEO Settings

{% content-ref url="/pages/LHlzFdFr8hVLrftTJKPh" %}
[SEO](/cms-bundle/en/elemente/konfigurationsbausteine/seo.md)
{% endcontent-ref %}


---

# 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.rh-webdesign.com/cms-bundle/en/elemente/call-to-action/einfacher-banner.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.
