Änderungen von Dokument CSS-Einstellungen für Assistenten / JavaScript

Zusammenfassung

• Seiteneigenschaften (2 geändert, 0 hinzugefügt, 0 gelöscht)

Details

Seiteneigenschaften

Titel

...	...	@@ -1,1 +1,1 @@
1		-CSS-Einstellungen für Assistenten / JavaScript
	1	+CSS-Einstellungen für Assistenten / JavaScipt

Inhalt

...	...	@@ -4,29 +4,31 @@
4	4
5	5	## CSS-Einstellungen für Assistenten
6	6
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.
	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.
8	8	Die Einstellungen werden zentral verwaltet und sind für alle Assistenten gültig.
9	9
10		-Änderungen im CSS-Bereich können die Barrierefreiheit der Anwendung beeinträchtigen.
	10	+**Voraussetzung:** Benutzerrecht **Layout verwalten**
11	11
12		-### Organisations-Konfiguration aufrufen
	12	+Rufen Sie im Formulareditor in der Hauptwerkzeugl
13	13
14		-**Voraussetzung:** Benutzerrecht **Layout verwalten**
	14	+oder JavaScript im Formulareditor zu hinterlegen. Hierzu steht die Schaltfläche „Administration“ in der [[Hauptwerkzeugleiste|Main.05_Assistenten.01_Hauptwerkzeugleiste]] zur Verfügung. Nach der Betätigung öffnet sich die Eingabemaske „Organisations-Konfiguration“ in der die CSS-Anweisungen oder das JavaScript mittels verschiedenen Möglichkeiten hinterlegt werden kann.
15	15
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]]
	16	+> {{icon name="far fa-info-circle" size="3"/}} _**Hinweis:**_
17	17
18		-{{icon name="far fa-arrow-right"}}{{/icon}}Der Dialog **Organisations-Konfiguration** öffnet sich.
	18	+1. Nur Benutzer die das [[Benutzerrecht|Main.07_Einstellungen-Fachadministration.02_Benutzer.01_Benutzerrollen]] „“ besitzen, steht diese Funktion zur Verfügung.
19	19
20		-### Reiter CSS
	20	+## Rubrik „CSS“
21	21
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**).
	22	+> {{icon name="far fa-info-circle" size="3"/}} _**Hinweis:**_ Sofern Sie kundespezifische Änderungen im CSS- oder JavaScript-Bereich vornehmen, kann dies die Barrierefreiheit der Anwendung beeinträchtigen.
23	23
24		-Im Feld **externes CSS (URL)** kann die Adresse einer gültigen CSS-Datei eingetragen werden, auf die der Formularserver über das Internet Zugriff hat.
	24	+### Externes CSS (URL)
25	25
26		-Beim Feld **internes CSS** können alle gängigen CSS-Regeln verwendet werden.
	26	+In der Eingabemaske „Organisations-Konfiguration“ besteht die Möglichkeit, in dem Eingabefeld ein externes CSS über eine URL zu hinterlegen.
27	27
28		-Zusätzlich stellen wir die Möglichkeit bereit den Assistenten, einzelne Panels oder einzelne Komponenten über entsprechende Attribute anzusprechen:
	28	+### Internes CSS
29	29
	30	+Weiterhin besteht die Möglichkeit, direkt in dem Eingabefeld „internes CSS“ den Quellcode der CSS-Anweisungen zu hinterlegen. Im Editor können alle gängigen CSS Regeln verwendet werden. Zusätzlich stellen wir die Möglichkeit bereit den Assistenten, einzelne Panels oder einzelne Komponenten über entsprechende Attribute anzusprechen:
	31	+
30	30	* **data-assistant-identifier**
31	31	Dieses Attribut enthält als Wert die jeweilige Assistentennummer und kann dazu verwendet werden das CSS assistentenspezifisch zu gestalten. Das Attribut wird als Elternknoten für die Attribute "data-panel-identifier" und "data-component-identifier" dargestellt.
32	32	* **data-panel-identifier**
...	...	@@ -40,7 +40,7 @@
40	40
41	41	#### Beispiel einer CSS Einstellung
42	42
43		-1. Beispiel: Im nachfolgenden Beispiel wurde mittels des CSS eingestellt, dass die Pflichtangaben mittels einem roten Quadrat ausgewiesen werden.
	45	+1. Beispiel: Im nachfolgenden Beispiel wurde mittels des CSS eingestellt, dass die Pflichtangaben mittels einem roten Quadrat ausgewiesen werden.![[Beispiel eines CSS im Assistenten|@CSSBeispiel.jpg]]
44	44	1. Beispiel: Mit dem nachfolgenden CSS-Beispiel werden die Platzierung der Schaltflächen „Abbruch“ und „Weiter“ vertauscht.`@media(min-width: 60em){ .fs-submitgroup
45	45
46	46	{ float: right; padding: 0 0 0 10px; } } .fs-exitButton, .fs-exitNoScriptButton