Schaltflächen-Dialog

Übersicht

Die Avonni Button Dialog-Komponente ist ein anpassbares Interface-Element für Salesforce Experience Cloud, das einen modalen Dialog auslöst.

Diese Komponente wird typischerweise verwendet, um zusätzliche Informationen anzuzeigen, Benutzereingaben anzufordern, ein Video darzustellen oder eine Bestätigungsnachricht anzuzeigen, ohne die aktuelle Seite zu verlassen.

Konfiguration des Avonni Button Dialog

Machen Sie Ihren Button-Dialog großartig

1. Fügen Sie die Komponente hinzu: Suchen Sie die Avonni Button Dialog-Komponente und ziehen Sie sie auf Ihre Website.

2. Lassen Sie es großartig aussehen: Sie können den Text des Buttons (das Label), den Farbstil (die Variante) und alle anderen visuellen Details nach Wunsch ändern.

3. Klicken und Erstellen: Ein Popup-Fenster (ein Modal) erscheint, wenn Sie auf die Schaltfläche klicken. Sie können alle möglichen coolen Dinge in dieses Fenster ziehen, wie die Avonni Video-Komponente oder andere nette Elemente.

Zusätzliche Einstellungen

• Header ausblenden: Dadurch wird die Titelleiste oben im Popup-Fenster entfernt.

• Größe: Wählen Sie, wie groß oder klein das Popup-Fenster sein soll.

• Footer anzeigen: Fügt einen Bereich am unteren Rand des Popups hinzu – ideal für Schaltflächen wie „OK“ oder „Abbrechen“.

• Innenabstand des Inhalts: Dies steuert den Abstand zwischen dem Inhalt im Inneren des Fensters und den Fensterrändern.

Einstellungen

Button-Konfiguration

Name	Beschreibung
Beschriftung	Auf dem Button angezeigter Text.
Icon-Name	Der Lightning Design System-Name des Symbols, das auf dem Button angezeigt werden soll.
Icon-Position	Die Position des Symbols relativ zum Label; Optionen sind ‚links‘ oder ‚rechts‘.
Variante	Definiert das Erscheinungsbild des Buttons, wie z. B. ‚brand‘, ‚neutral‘ usw., entsprechend vordefinierten Stilen im Salesforce Design System.
Horizontale Ausrichtung	Richtet den Button horizontal innerhalb seines Containers aus; Optionen sind ‚links‘, ‚zentriert‘ oder ‚rechts‘.
Dehnen	Bestimmt, ob der Button sich ausdehnen soll, um die Breite seines Containers auszufüllen.
Deaktiviert	Deaktiviert den Button und verhindert Benutzerinteraktion.

Dialog-Konfiguration

Name	Beschreibung
Header ausblenden	Schaltet die Sichtbarkeit des Dialog-Headers um.
Größe	Legt die Größe des Dialogs fest; Optionen können ‚klein', 'mittel‘ oder ‘groß.
Fußzeile anzeigen	Bestimmt, ob der Footer des Dialogs angezeigt werden soll, der Aktionsschaltflächen enthalten kann.

🎨 Gestaltung

Name	Beschreibung
Kopfzeile	Gibt die Hintergrundfarbe des Dialog-Headers an.
Inhalt	Legt die Hintergrundfarbe für den Hauptinhaltsbereich des Dialogs fest.
Fußzeile	Definiert die Hintergrundfarbe für den Footer-Bereich.