Ä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 / JavaScipt
	1	+CSS-Einstellungen für Assistenten / JavaScript

Inhalt

...	...	@@ -1,28 +1,33 @@
1		-In
	1	+**Inhaltsverzeichnis:**
2	2
	3	+{{toc start="2"/}}
	4	+
3	3	## CSS-Einstellungen für Assistenten
4	4
5		-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.
6	6	Die Einstellungen werden zentral verwaltet und sind für alle Assistenten gültig.
7	7
8		-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.
	10	+Änderungen im CSS-Bereich können die Barrierefreiheit der Anwendung beeinträchtigen.
9	9
10		-> {{icon name="far fa-info-circle" size="3"/}} _**Hinweis:**_
	12	+### Organisations-Konfiguration aufrufen
11	11
12		-1. Nur Benutzer die das [[Benutzerrecht|Main.07_Einstellungen-Fachadministration.02_Benutzer.01_Benutzerrollen]] „Layout verwalten“ besitzen, steht diese Funktion zur Verfügung.
	14	+**Voraussetzung:** Benutzerrecht **Layout verwalten**
13	13
14		-## Rubrik „CSS“
	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]]
15	15
16		-> {{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.
	18	+{{icon name="far fa-arrow-right"}}{{/icon}}Der Dialog **Organisations-Konfiguration** öffnet sich.
17	17
18		-### Externes CSS (URL)
	20	+### Reiter CSS
19	19
20		-In der Eingabemaske „Organisations-Konfiguration“ besteht die Möglichkeit, in dem Eingabefeld ein externes CSS über eine URL zu hinterlegen.
	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**).
21	21
22		-### Internes CSS
	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.
	25	+Beim Feld **internes CSS** können alle gängigen CSS-Regeln verwendet werden.
23	23
24		-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:
	27	+Über Attribut
25	25
	29	+Zusätzlich stellen wir die Möglichkeit bereit den Assistenten, einzelne Panels oder einzelne Komponenten über entsprechende Attribute anzusprechen:
	30	+
26	26	* **data-assistant-identifier**
27	27	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.
28	28	* **data-panel-identifier**
...	...	@@ -36,7 +36,7 @@
36	36
37	37	#### Beispiel einer CSS Einstellung
38	38
39		-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	+1. Beispiel: Im nachfolgenden Beispiel wurde mittels des CSS eingestellt, dass die Pflichtangaben mittels einem roten Quadrat ausgewiesen werden.
40	40	1. Beispiel: Mit dem nachfolgenden CSS-Beispiel werden die Platzierung der Schaltflächen „Abbruch“ und „Weiter“ vertauscht.`@media(min-width: 60em){ .fs-submitgroup
41	41
42	42	{ float: right; padding: 0 0 0 10px; } } .fs-exitButton, .fs-exitNoScriptButton