Wiki-Quellcode von Navigationsleisten-Plugin
Zeige letzte Bearbeiter
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{figure image="1_WidgetXNavigationBar_Logo_de.png" clear="h3"}}Das Symbol für Elemente vom Typ //Navigationsleiste// im {{designer/}}.{{/figure}} | ||
| 2 | |||
| 3 | [[**Plugin-Download**>>url:https://customer.formcycle.eu/index.php/apps/files/?dir=/FORMCYCLE%20-%20Plugins%20Customer/plugin-bundle-widget-xnavigationbar&fileid=16534||target="_blank"]] (erfordert Anmeldung) | ||
| 4 | |||
| 5 | {{content/}} | ||
| 6 | |||
| 7 | == Funktionsbeschreibung == | ||
| 8 | {{figure image="2_WidgetXNavigationBar_Formular_de.png" clear="h3"}}Beispiel für eine eingefügte Navigationsleiste im Header eines Formulars.{{/figure}} | ||
| 9 | |||
| 10 | Das Plugin stellt ein neues Widget im Designer zur Verfügung, welches es erlaubt, auf einfache Art eine Navigationsleiste auf Formularseiten einzufügen. Das Widget verwendet individuell im Designer zu konfigurierende Einstellungen im Bezug auf die Benamung der Links und die Seiten auf die diese verweisen. Durch einen Klick im Element auf vorangegangende Seiten, kann zu diesen zurückgesprungen werden. | ||
| 11 | |||
| 12 | Das Navigationsleisten-Element kann im Header oder Footer des Formulars platziert werden, wodurch man es nur ein Mal konfigurieren muss. Anderenfalls, muss je ein Navigationsleisten-Element auf jeder Seite, auf der eins sichtbar sein soll, eingefügt und entsprechend konfiguriert werden. In diesem Fall empfiehlt es sich, die Konfiguration einmalig vorzunehmen und das konfigurierte Element dann zu kopieren und auf den anderen Seiten einzufügen oder die Konfiguration in einer [[Datenquelle>>doc:Formcycle.UserInterface.Data.Sources.WebHome]]. zu hinterlegen und diese bei //Optionen// als Quelle auszuwählen. | ||
| 13 | |||
| 14 | == Installation == | ||
| 15 | |||
| 16 | Das Plugin kann als Mandant-Plugin oder System-Plugin installiert werden. Eine Anleitung zur Installation von Plugins finden Sie [[hier>>doc:Formcycle.UserInterface.Client.Plugins.WebHome]]. | ||
| 17 | |||
| 18 | == Konfiguration == | ||
| 19 | |||
| 20 | An Elementen dieses Typs können die folgenden Eigenschaften konfiguriert werden: | ||
| 21 | |||
| 22 | {{internBaseOptionsElement page="base" headline="h3"/}} | ||
| 23 | |||
| 24 | === Darstellung === | ||
| 25 | |||
| 26 | In diesem Bereich kann für Navigationsleisten-Elemente nur die Positionierung der unter //Optionen// eingetragenen Bescjhreibungstexte der Seiten relativ zu dem sich darüber befindlichen Fortschrittsbalkenelement bestimmt werden. | ||
| 27 | |||
| 28 | {{internBaseOptionsElement page="label" headline="h3"/}} | ||
| 29 | Innerhalb des Labels kann mithilfe der Plathalter {{code language="none"}}{1}{{/code}} und {{code language="none"}}{2}{{/code}} die Nummer der Aktuellen Seite in der Liste und die Anzahl der im Element konfigurierten Seiten eingefügt werden. | ||
| 30 | |||
| 31 | === Optionen === | ||
| 32 | |||
| 33 | {{figure image="3_WidgetXNavigationBar_Optionen_de.png" clear="h3"}}Mögliche Konfiguration der zu verwendenen Auswahloptionen eines Bewertungselements.{{/figure}} | ||
| 34 | |||
| 35 | Navigationsleisten-Elemente verfügen über einen zusätzlichen Bereich //Optionen//. Hier können die in der Navigationsleiste sichtbaren Seiten und die für die jeweilige Formularseite anzuzeigenden Namen festgelegt werden. | ||
| 36 | |||
| 37 | Für jede anzuzeigende Formularseite ist eine Zeile mit dem sichtbaren Beschreibungstext, dem technischen Namen der Seite einzugeben. Optional können in der Spalte Titel die //Title//-Attribute der Beschreibungstexte festgelegt werden. | ||
| 38 | |||
| 39 | Neben der Konfiguration der Optionen direkt am Element ist es zudem möglich, eine [[CSV-Datenquelle>>doc:Formcycle.UserInterface.Data.Sources.WebHome]] zu verwenden. Diese kann im Auswahlelement //Datenquelle// selektiert werden. | ||
| 40 | |||
| 41 | {{internBaseOptionsElement page="css" headline="h3"/}} | ||
| 42 | |||
| 43 | {{internBaseOptionsElement page="attr" headline="h3"/}} | ||
| 44 | |||
| 45 | {{internBaseOptionsElement page="avail" headline="h3"/}} | ||
| 46 | |||
| 47 | {{internBaseOptionsElement page="misc" headline="h3"/}} | ||
| 48 | |||
| 49 | {{velocity}} | ||
| 50 | |||
| 51 | ##Darstellung Ausrichtung | ||
| 52 | ##Label Ausrichtung: Position des Labeltexts; Platzhaler sind 1 und 2 | ||
| 53 | ##Optionen Bennenung und Name der Seiten, welche in der Navigationsleiste dargestellt werden sollen. Die Reihenfolge der Optionen enspricht der Reihenfolge der Seiten im Navigationsleisten-Element. | ||
| 54 | {{/velocity}} | ||
| 55 | |||
| 56 | == Word-/PDF-Export == | ||
| 57 | |||
| 58 | Standardmäßig ist das Element so konfiguriert, dass es nicht im Word-/PDF-Export auftaucht. Es ist auch nicht sinnvoll, an dieser Einstellung etwas zu ändern, da nur der Labeltext exportiert werden kann und beim Word-/PDF-Export keine Ersetzung der Platzhalter stattfindet. | ||
| 59 | |||
| 60 | == Mögliche CSS-Anpassungen == | ||
| 61 | |||
| 62 | Um das Aussehen des Elementes zu individualisieren, können per CSS Anpassungen vorgenommen werden. | ||
| 63 | |||
| 64 | Zum Beispiel kann die Farbe des Fortschrittbalkens folgendermaßen angepasst werden: | ||
| 65 | |||
| 66 | {{code language="css"}} | ||
| 67 | .XNavigationBar .active .xnav-view, .XNavigationBar .active-before .xnav-view { | ||
| 68 | background-color: red; | ||
| 69 | } | ||
| 70 | {{/code}} | ||
| 71 | |||
| 72 | {{velocity}} | ||
| 73 | ##{{content moveToTop="true"/}} | ||
| 74 | ##{{figure image="1_WidgetXrating_Designer_de.png" clear="h1"}}Das Symbol für Elemente vom Typ //Bewertung//.{{/figure}} | ||
| 75 | {{/velocity}} |