Buttons, die zusammengehören.

Amber Halo als Primary, Ghost und Ghost Line als Secondary. Alle Beispiele sind native Bricks-Buttons und lassen sich kopieren. „Light“ meint immer den hellen Hintergrund der Section.

Empfohlen: Komponente „WN Button“ unter Komponenten einfügen. Der Pfeil ist bereits integriert. Pro Verwendung Button-Text, Link-Ziel und Variante einstellen. Ohne Variantenauswahl gilt Primary auf dunklem Hintergrund. Der erste Primary unten ist bereits eine Komponenten-Instanz und verlinkt zu den hellen Beispielen. Die übrigen Beispiele zeigen weiterhin die einzelnen CSS-Klassen.

Link oder Aktion: Mit Link-Ziel entsteht ein Link; ohne Link-Ziel ein echter Button (type="button"). Für ein Bricks-Popup das Link-Ziel leer lassen und die numerische Template-ID in „Popup-ID“ eintragen. Das Popup muss über seine Template-Bedingungen auf der jeweiligen Seite verfügbar sein. Der aktive Helfer „WN · Button · Popup Action“ öffnet es beim Klick. Für andere individuell programmierte Aktionen steht die optionale Aktionsklasse als Selektor bereit. Ein eigener Interaktionen-Editor pro Komponenten-Instanz ist hier nicht verfügbar.

Zentrale Pflege: Main Style → Button für die Grundtypografie. FluentSnippets → „WN · Button System · Amber Halo“ für Glas, Farben, Varianten und Bewegung. Alte Gestaltungsklassen wie wn-glass bei neuen Buttons weglassen.