Wiki-Quellcode von CSS-Einstellungen für Assistenten / JavaScript

Version 432.1 von MACH formsolutions am 15.10.2025

version	line-number	content
431.8	1	Inhaltsverzeichnis:
431.7	2
431.8	3	{{toc start="2"/}}
	4
431.7	5	## CSS-Einstellungen für Assistenten
	6
431.10	7	Mit CSS-Anweisungen (Cascading Style Sheets) können Sie die visuelle Gestaltung Ihrer veröffentlichten Assistenten verändern. Damit gleichen Sie die Assistenten optisch nahtlos an Ihre Website und Ihre gewohnte Corporate Identity an.
432.1	8	Die Anpassungen werden zentral verwaltet und sind für alle Assistenten gültig, sowie im Bereich _Payment_ und _eID_.
1.1	9
431.10	10	Änderungen im CSS-Bereich können die Barrierefreiheit der Anwendung beeinträchtigen.
431.9	11
431.10	12	### Organisations-Konfiguration aufrufen
431.9	13
431.10	14	Voraussetzung: Benutzerrecht Layout verwalten
431.2	15
431.11	16	Klicken Sie im Formulareditor in der [[Hauptwerkzeugleiste\|doc:Main.05_Assistenten.01_Hauptwerkzeugleiste.WebHome]] die Schaltfläche Administration an.![[Schaltfläche Administration\|Main.05_Assistenten.01_Hauptwerkzeugleiste.WebHome@HauptwerkzeugleisteCSS.jpg]]
1.1	17
431.10	18	{{icon name="far fa-arrow-right"}}{{/icon}}Der Dialog Organisations-Konfiguration öffnet sich.
431.1	19
431.20	20	### Reiter "CSS"
1.1	21
431.10	22	Verweisen Sie auf eine externe Quelle, aus der die CSS-Anweisungen geladen werden (externes CSS), oder tragen Sie Anweisungen/Code direkt in der Konfiguration ein (internes CSS).
1.1	23
431.19	24	Im Feld externes CSS (URL) kann die Internetadresse einer CSS-Datei eingetragen werden, auf die der Formularserver Zugriff hat.
431.10	25	Beim Feld internes CSS können alle gängigen CSS-Regeln verwendet werden.
1.1	26
431.19	27	Über Attribute können spezifische Assistenten, Panels oder Komponenten ausgewählt werden.
431.11	28
431.18	29	\| Attribut \| Beschreibung \| Beispiel \|
	30	\| ------------------------- \| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ \| -------------------------------------------------------------------------------------------- \|
	31	\| data-assistant-identifier \| Wert ist die Artikelnummer
	32	Elternknoten für die Attribute "`data-panel-identifier`" und "`data-component-identifier`" \| [data-assistant-identifier="KFAS_123456"] h2 { color: orange !important; } \|
431.19	33	\| data-panel-identifier \| Wert ist die technische Bezeichnung des Panels
	34	Elternknoten für das Attribut "`data-component-identifer`" \| [data-panel-identifier="Beispielpanel_1"] h2 { color: yellow !important; } \|
431.18	35	\| data-component-identifier \| Wert ist die technische Bezeichnung der Komponente
	36	Unterhalb des Attributs "`data-panel-identifier`" können mehrere Attribute "`data-component-identifier`" vorkommen. Verschachtelte Komponenten werden mit Punkten zwischen den technischen Bezeichnungen getrennt als Wert dargestellt. Beispiel: _Objektgruppenname.Komponentenname_ \| [data-component-identifier="Textfeld (einzeilig)"] input{ border-color: orange !important; } \|
1.1	37
431.20	38
1.1	39
431.23	40	### Reiter "CSS-Generator"
431.20	41
432.1	42	Mithilfe grafischer Werkzeuge können Sie hier grundlegende Einstellungen für die Assistentensicht festlegen. Der generierte Code kann anschließend manuell bearbeitet und weiter angepasst werden.
431.20	43
432.1	44	Nutzung des CSS-Generators:
431.23	45
432.1	46	1. Hintergrundfarbe und/oder Schriftfarbe mithilfe der Farbwähler festlegen
	47	1. Schriftart(en)/Schriftfamilie(n) auswählen und mit den Pfeiltasten in den rechten Bereich verschieben
	48	1. Schaltfläche Generieren anklicken
1.1	49
432.1	50	{{icon name="far fa-arrow-right"}}{{/icon}}Der CSS-Code ist im Abschnitt CSS > internes CSS eingetragen.
1.1	51
432.1	52	## JavaScript-Einstellungen
315.1	53
432.1	54	Änderungen im JavaScript-Bereich können die Barrierefreiheit der Anwendung beeinträchtigen.
1.1	55
432.1	56	Im Reiter JavaScript der Organisations-Konfiguration kann JavaScript konfiguriert werden, das mandantenweit in allen Assistenten und Panels ausgeführt wird.
1.1	57
432.1	58	Weitere Informationen zu JavaScript in MACH formsolutions finden Sie im Artikel [[JavaScript-Konfiguration\|Main.05_Assistenten.04_Assistentenbauoberfläche.15_JavaScript]].