> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/experience-components/ax-alert.md).

# AX - Warnung

## Übersicht

**AX - Warnung** ist eine Experience-Cloud-Komponente, die wichtige Nachrichten und Benachrichtigungen für Portalnutzer auf Experience-Sites-Seiten anzeigt.

Verwenden Sie sie, um Systemwarnungen, Fehlermeldungen, Warnungen, Erfolgsbestätigungen oder zeitkritische Ankündigungen anzuzeigen. Steuern Sie, wann Warnungen angezeigt werden, was sie sagen und wie sie aussehen – alles ohne Code im Experience Builder konfiguriert.

Ideal für Hinweise zu Portalwartungen, Bestätigungen von Formularübermittlungen, Kontostatus-Warnungen oder um Benutzer durch Prozesse auf Kunden- oder Partnerportalen zu führen.

<figure><img src="/files/621412f9a87d729b6124accb3cfe3d932f11049b" alt=""><figcaption></figcaption></figure>

***

## Einstellungen

{% tabs %}
{% tab title="🎛️ Eigenschaften" %}

<table><thead><tr><th width="183">Attribut</th><th>Beschreibung</th></tr></thead><tbody><tr><td><strong>Variante</strong></td><td><p>Das Attribut „variant“ ermöglicht es Ihnen, das Erscheinungsbild der Avonni-Alert-Komponente anzupassen, um die Art der übermittelten Warnung besser widerzuspiegeln. Verfügbare Varianten sind:</p><ul><li><strong><code>Fehler</code></strong>: Für kritische Benachrichtigungen oder Probleme.</li><li><strong><code>Basis</code></strong>: Eine standardmäßige Warnung für allgemeine Zwecke.</li><li><strong><code>offline</code></strong>: Weist auf Konnektivitäts- oder Verfügbarkeitsprobleme hin.</li><li><strong><code>Warnung</code></strong>: Für Warnungen, die Aufmerksamkeit erfordern, aber nicht kritisch sind.</li></ul><p>Wählen Sie eine Variante, die zu der Botschaft passt, die Sie vermitteln möchten, um das Verständnis der Benutzer zu verbessern.</p></td></tr><tr><td><strong>Inhalt</strong></td><td>Das Attribut „content“ legt die Hauptnachricht oder Information fest, die Sie in der Avonni-Alert-Komponente vermitteln möchten. Es enthält den Textinhalt, der innerhalb der Warnung angezeigt wird und sicherstellt, dass Benutzer über die spezifische Benachrichtigung oder Situation informiert werden.</td></tr><tr><td><strong>Symbolname</strong></td><td>Das Attribut „icon name“ ermöglicht es Ihnen, ein bestimmtes Symbol für die Avonni-Alert-Komponente festzulegen. Durch Angabe eines Symbolnamens können Sie die Art oder den Kontext der Warnung visuell darstellen und so die Klarheit verbessern und die Aufmerksamkeit des Benutzers sofort auf die Nachricht lenken.</td></tr><tr><td><strong>Symbolgröße</strong></td><td><p>Das Attribut „icon size“ in der Avonni-Alert-Komponente steuert die Größe des Symbols:</p><ul><li><strong>XXS</strong>: Extra-extra-klein für eine dezente Hervorhebung.</li><li><strong>XS</strong>: Extra-klein für minimale Präsenz.</li><li><strong>Klein</strong>: Ein moderates Format für mittlere Sichtbarkeit.</li><li><strong>Mittel</strong>: Standardgröße für ausgewogene Sichtbarkeit.</li><li><strong>Groß</strong>: Für maximale visuelle Wirkung</li></ul></td></tr><tr><td><strong>Ist schließbar</strong></td><td>Das Attribut „Is Dismissible“ ermöglicht es Benutzern, die Avonni Alert in der Benutzeroberfläche zu schließen oder zu verwerfen. Wenn es aktiviert ist, erscheint eine Schaltfläche zum Schließen in der Warnung, die das manuelle Entfernen durch den Benutzer ermöglicht.</td></tr></tbody></table>
{% endtab %}

{% tab title="🎨 Gestaltung" %}

<table><thead><tr><th width="183">Attribut</th><th>Beschreibung</th></tr></thead><tbody><tr><td><strong>Abstände</strong></td><td><p>Die Einstellung für das Abstands-Styling in der Avonni-Alert-Komponente ermöglicht es Ihnen, Ränder anzupassen:</p><ul><li><strong>Blockanfang</strong>: Legen Sie den oberen Rand fest.</li><li><strong>Blockende</strong>: Passen Sie den unteren Rand an.</li><li><strong>Inline-Start</strong>: Konfigurieren Sie den linken Rand.</li><li><strong>Inline-Ende</strong>: Ändern Sie den rechten Rand</li></ul></td></tr><tr><td><strong>Hintergrund</strong></td><td><p>Die Einstellung für das Hintergrund-Styling in der Avonni-Alert-Komponente bietet Anpassungen für den Hintergrund:</p><ul><li><strong>Farbe</strong>: Wählen Sie eine Vollfarbe für den Hintergrund.</li><li><strong>Linearer Farbverlauf</strong>: Wählen Sie diese Option für einen dynamischen, visuell ansprechenden Verlaufseffekt</li></ul></td></tr><tr><td><strong>Text</strong></td><td><p>Die Einstellung für das Text-Styling in der Avonni-Alert-Komponente ermöglicht die Anpassung des Textes:</p><ul><li><strong>Farbe</strong>: Ändern Sie die Textfarbe für bessere Sichtbarkeit.</li><li><strong>Schriftstärke</strong>: Wählen Sie die Schriftschnittstärke zur Hervorhebung.</li><li><strong>Horizontale Ausrichtung</strong>: Wählen Sie die Ausrichtung des Textes für eine optimale Darstellung in der Warnung</li></ul></td></tr><tr><td><strong>Rahmen</strong></td><td><p>Die Einstellung für das Rahmen-Styling in der Avonni-Alert-Komponente bietet Optionen zur Anpassung des Erscheinungsbilds des Rahmens:</p><ul><li><strong>Farbe</strong>: Wählen Sie eine Farbe für die Kante des Rahmens.</li><li><strong>Größe</strong>: Wählen Sie die Dicke des Rahmens.</li><li><strong>Stil</strong>: Legen Sie das Gesamtbild mit verschiedenen Stilen fest</li></ul></td></tr><tr><td><strong>Symbol</strong></td><td><p>Die Einstellung für das Symbol-Styling in der Avonni-Alert-Komponente ermöglicht verschiedene Anpassungen des Erscheinungsbilds des Symbols:</p><ul><li><strong>Hintergrundfarbe</strong>: Ändern Sie die Hintergrundfarbe hinter dem Symbol.</li><li><strong>Vordergrundfarbe</strong>: Ändern Sie die Hauptfarbe des Symbols.</li><li><strong>Schließen-Symbol im Vordergrund</strong>: Legen Sie die Farbe des Symbols fest, um die Warnung zu schließen.</li><li><strong>Hilfsklassen für die Vordergrundfarbe</strong>: Nehmen Sie weitere Farbanpassungen für bessere Sichtbarkeit und Kontrast vor</li></ul></td></tr></tbody></table>

{% hint style="info" %}
einige Stilattribute können dynamisch....
{% endhint %}
{% endtab %}
{% endtabs %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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.avonnicomponents.com/experience-cloud/experience-cloud-de/experience-components/ax-alert.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.
