Wiki-Quellcode von Gewinnspiel-Portal-Plugin

Zeige letzte Bearbeiter
1 [[**Plugin-Download**>>url:https://customer.formcycle.eu/index.php/apps/files/?dir=/FORMCYCLE%20-%20Plugins%20Customer/Gewinnspiel-Portal (fc-portal-contest)&fileid=13794||rel="noopener noreferrer" target="_blank"]] (erfordert Anmeldung)
2
3 {{content/}}
4
5 {{info}}
6 {{version major="6" minor="1" patch="0"/}}Für das Gewinnspiel-Portal-Plugin wird mindestend {{formcycle/}} in der Version 6.1.0 benötigt
7 {{/info}}
8
9 {{figure image="beispiel_de.jpg" clear="h2"}}
10 Beispiel für ein mit dem Plugin erstelltes Gewinnspiel-Portal.
11 {{/figure}}
12
13 Das Gewinnspiel-Portal bietet die Möglichkeit, Portale für eine beliebige Anzahl an Gewinnspielen innerhalb von {{formcycle/}} zu erstellen und verwalten. Diese Gewinnspiele nutzen für die Dateneingabe der Teilnehmer {{formcycle/}} Formulare. Das Gewinnspiel-Portal kann auf allen Mandanten auf dem {{fcserver/}} genutzt werden, wobei auf jedem Mandanten ein eigenes Gewinnspiel-Portal eingerichtet werden kann.
14
15 == Installation ==
16
17 Das Gewinnspiel-Portal kann nur als [[Systemplugin>>doc:Formcycle.SystemSettings.UserInterface.SystemPlugins]] installiert werden und ist daher automatisch für alle Mandanten auf dem {{formcycle/}} Server nutzbar. Das Gewinnspiel-Portal besteht aus zwei separaten Plugins, //contest-view-portal.jar// und //contest-management-portal.jar//, welche zwingend zusammen installiert werden müssen. Es ist dabei egal, in welcher Reihenfolge die beiden Plugins installiert werden.
18
19 == Rollenrechte ==
20
21 {{figure image="rollenrechte_de.png" clear="h2"}}
22 Nach der Installation des Plugins zusätzlich konfigurierbare [[Rollenrechte>>doc:Formcycle.UserInterface.UserSettings.Roles]] in der Benuterverwaltung.
23 {{/figure}}
24
25 Die Menüeinträge des Gewinnspielportals sind auf der {{formcycle/}} Oberfläche standardmäßig nicht sichtbar. Es müssen daher bei den entsprechenden Nutzergruppen unter [[Rollen>>doc:Formcycle.UserInterface.UserSettings.Roles]] die Rechte für das Konfigurieren und für das Öffnen des Gewinnspielportals gesetzt werden. Diese Rechte sind wie folgt untergliedert:
26
27 === Gewinnspiel-Portal verwalten ===
28
29 Unter diesem Hauptpunkt können alle für die Administration des Gewinnspiel-Portals nötigen Rechte vergeben werden.
30
31 ==== Gewinnspiele verwalten ====
32
33 ; Gewinnspiel anlegen (leer)
34 : Berechtigung ein neues Gewinnspiel anzulegen, welches nicht auf einer Vorlage beruht
35
36 ; Gewinnspiel importieren
37 : Berechtigung ein exportiertes Gewinnspiel importieren zu dürfen
38
39 ; Gewinnspiel aus Vorlage anlegen
40 : Berechtigung ein neues Gewinnspiel anzulegen, welches auf einer Vorlage aufbaut
41
42 ; Gewinnspiel kopieren
43 : Berechtigung ein vorhandenes Gewinnspiel kopieren zu dürfen
44
45 ; Gewinnspiel exportieren
46 : Berechtigung ein vorhandenes Gewinnspiel exportieren zu dürfen
47
48 ; Gewinnspiel löschen
49 : Berechtigung ein vorhandenes Gewinnspiel löschen zu dürfen
50
51 ; Gewinnspiel-Formular bearbeiten
52 : Berechtigung ein vorhandenes Gewinnspiel bearbeiten zu dürfen
53
54 ==== Vorlagen verwalten ====
55
56 Notwendige Berechtigung, um neue Gewinnspielvorlagen erstellen und vorhandene Gewinnspielvorlagen bearbeiten und löschen zu dürfen. Nur wenn dieses Recht aktiv ist, kann der Nutzer ein vorhandenes Gewinnspiel als Vorlage speichern.
57
58 ==== Konfigurieren ====
59
60 Berechtigung, um die für alle Gewinnspiele verwendete Oberfläche konfigurieren zu dürfen
61
62 === Gewinnspiel-Portal öffnen ===
63
64 Berechtigung, das Gewinnspiel-Portal aus {{formcycle/}} heraus direkt öffnen zu dürfen
65
66 == Menüpunkte auf der Verwaltungsoberfläche ==
67
68 {{figure image="portal_menue_elemente_de.png" clear="h2" width="150"}}
69 Zusätzliche Menüpunkte auf der {{formcycle/}} Verwaltungsoberfläche.
70 {{/figure}}
71
72
73 {{html wiki="true"}}
74 <div class='xm-figure xm-float-right xm-clear-h2' data-alt='Zusätzliche Menüpunkte auf der Verwaltungsoberfläche.'><div class='xm-figure-inner' style='width:160px'>{{lightbox image='portal_menue_elemente_de.png' width='150' group='$height' group='$group' title='Zusätzliche Menüpunkte auf der Verwaltungsoberfläche.'/}}<div class='xm-figure-caption'>Zusätzliche Menüpunkte auf der {{formcycle/}} Verwaltungsoberfläche.</div></div></div>
75 {{/html}}
76
77
78 Durch die Konfiguration der entprechenden Rollenrechte erscheinen die folgenden neuen Menüeinträge auf der Verwaltungsoberfläche:
79
80
81 === Gewinnspiele ===
82
83 Nachdem das Gewinnspiel-Portal installiert wurde und der entsprechende Nutzer die Berechtigungen erhalten hat, befinden sich auf der {{formcycle/}} Verwaltungsoberfläche ein neuer Menüpunkt //Gewinnspiele// mit den folgenden drei Unterpunkten:
84
85 ; Gewinnspiele verwalten
86 : Unter diesem Punkt können Gewinnspiele angelegt und die Einstellungen von vorhandenen Gewinnspielen eingesehen und angepasst werden. Siehe [[Gewinnspiele verwalten>>doc:Formcycle.PluginDocumentation.ContestPortalPlugin.WebHome||anchor="backend_gewinnspiele"]].
87
88 ; Vorlagen verwalten
89 : Unter diesem Punkt können neue Vorlagen für Gewinnspiele angelegt und vorhandene Vorlagen eingesehen und angepasst werden. Siehe [[Vorlagen verwalten>>doc:Formcycle.PluginDocumentation.ContestPortalPlugin.WebHome||anchor="backend_vorlagen"]].
90
91 ; Konfiguration
92 : Unter diesem Punkt können Stuktur, Aussehen und Verhalten des Gewinnspiel-Portals konfiguriert werden. Siehe [[Portal konfigurieren>>doc:Formcycle.PluginDocumentation.ContestPortalPlugin.WebHome||anchor="backend_portal"]].
93
94 === Gewinnspiel öffnen ===
95
96 Wenn für den Benutzer in den Rollenrechten die Berechtigung zum Öffnen des Gewinnspiel-Portals gegeben wurde, erscheint im Hauptmenü auf der {{formcycle/}} Verwaltungsoberfläche eine zusätzliche Schaltfläche //Gewinnspiel öffnen//.
97
98 == Grundstruktur des Gewinnspiel-Portals ==
99
100 Mit dem Gewinnspiel-Portal kann aus mehreren vorgegebenen Elementen eine Portal-Webseite konfiguriert werden, in welcher die für ein Gewinnspiel-Portal benötigten Elemente enthalten sind. Die Webseite untergliedert sich in die folgenden Elemente:
101
102 ; (1) Kopfbereich, (7) Fußbereich und (4) Trenner vom Portal
103 : Diese Elemente werden einmal konfiguriert und werden für alle Gewinnspiele im Gewinnspiel-Portal genutzt.
104
105 ; (2) Bannergrafik, (3) Inhalt (Formular, Beschreibung, ggf. Ankündigungen oder Mitteilungen über den Beginn oder das Ende des Gewinnspiels), (5) Teilnahmebedingungen und (6) Datenschutz
106 : Diese Elemente können für jedes Gewinnspiel individuell konfiguriert werden.
107
108 {{lightbox image="portal_aufbau_de.jpg" group="g0" width="800"/}}
109
110 == Verwaltungsoberfläche im FORMCYCLE Backend ==
111
112 {{id name="backend_gewinnspiele"/}}
113
114 === Gewinnspiele verwalten ===
115
116 {{figure image="gewinnspiele_ui_de.png" clear="h2"}}
117 Verwaltungsoberfläche für den Menüpunkt //Gewinnspiele verwalten//
118 {{/figure}}
119
120 Unter diesem Menüpunkt können die vorhandenen Gewinnspiele verwaltet und neue Gewinnspiele angelegt werden.
121
122 ==== Menü ====
123
124 Auf der linken Seite befindet sich die Liste aller vorhandenen Gewinnspiele. Über die Buttons über der Liste kann ein neues Gewinnspiel angelegt werden {{ficon name="plus-circle-outline"/}} oder ein zuvor in der Liste ausgewähltes Gewinnspiel kopiert {{icon name="fa-files-o" title="Kopieren" size="1x" cssClass="fa-files-o"/}}, exportiert {{icon name="fa-download" title="Exportieren" size="1x" cssClass="fa-download"/}}, als Vorlage gespeichert {{icon name="fa-save" title="Als Vorlage speichern" size="1x" cssClass="fa-save"/}} oder gelöscht {{ficon name="trash-alt2"/}} werden. Über die Suchen-Schaltfläche {{icon name="fa-search" title="Suchen" size="1x" cssClass="fa-search"/}} kann ein Eingabefeld eingeblendet werden, nach dessen Inhalt die Gewinnspiel-Liste automatisch gefiltert wird. Beim Anlegen eines neuen Gewinnspiels kan entweder ein neues leeres Gewinnspiel angelegt, ein zuvor exportiertes Gewinnspiel wieder geladen oder eine Vorlage als Grundlage für das Gewinnspiel verwendet werden.
125
126 Links neben dem Namen des Gewinnspiels wird jeweils ein Symbol angezeigt, welches die folgende Bedeutung hat:
127
128 ; {{ficon name="checkbox-marked-circle"/}}
129 : Ein ausgefüllter Kreis mit Haken bedeutet, dass das Gewinnspiel aktiviert ist und sich aktuell innerhalb des konfigurierten Online-Zeitraumes befindet
130 ; {{ficon name="checkbox-marked-circle-outline"/}}
131 : Ein nicht ausgefüllter Kreis mit Haken bedeutet, dass das Gewinnspiel aktiviert ist, sich aber aktuell nicht innerhalb des konfigurierten Online-Zeitraumes befindet. Das heißt dass das Gewinnspiel entweder nicht mehr oder noch nicht online ist.
132 ; {{ficon name="circle-outline"/}}
133 : Ein leerer Kreis bedeutet, dass das Gewinnspiel momentan nicht aktiv ist
134
135 ==== Einstellungen ====
136
137 {{figure image="gs_onlineeinstellungen_de.png" clear="h2"}}
138 Mögliche Optionen zum Konfigurieren der (datumsabhängigen) Sichtbarkeit des Gewinnspiels und der Positionierung des Beschreibungstextes
139 {{/figure}}
140
141
142 {{html wiki="true"}}
143 <div class='xm-figure xm-float-right xm-clear-h2' data-alt='Mögliche Optionen zum Konfigurieren der (datumsabhängigen) Sichtbarkeit des Gewinnspiels und der Positionierung des Beschreibungstextes'><div class='xm-figure-inner' style='width:310px'>{{lightbox image='gs_onlineeinstellungen_de.png' width='300' group='$height' group='$group' title='Mögliche Optionen zum Konfigurieren der (datumsabhängigen) Sichtbarkeit des Gewinnspiels und der Positionierung des Beschreibungstextes'/}}<div class='xm-figure-caption'>Mögliche Optionen zum Konfigurieren der (datumsabhängigen) Sichtbarkeit des Gewinnspiels und der Positionierung des Beschreibungstextes</div></div></div>
144 {{/html}}
145
146
147 Nachdem auf die //Neues Gewinnspiel//-Schaltfläche geklickt oder ein Gewinnspiel in der Liste ausgewählt wurde, erscheint rechts die Konfigurationsseite für das Gewinnspiel. Hier können im oberen Bereich links konfiguriert werden, wann und wie das Gewinnspiel sichtbar sein soll. Die foldenden Optionen können konfiguriert werden:
148
149
150 ; **Aktiviert (Das Gewinnspiel ist aufrufbar)**
151 : Das Gewinnspiel kann über einen Link aufgerufen werden
152
153 ; **Gewinnspiel im Portal anzeigen**
154 : Das Gewinnspiel wird im Portal angezeigt; Nur anwählbar, wenn die Option //**Aktiviert** (Das Gewinnspiel ist aufrufbar)// zuvor angewählt wurde; Anderenfalls ist diese Option ausgegraut und das Gewinnspiel wird nicht im Portal angezeigt
155
156 ; **Name des Gewinnspiels:**
157 : Im Portal angezeigter Name des Gewinnspiels. Wird zudem als //title//-Attribut für das {{formcycle/}}-Formular des Gewinnspiels verwendet.
158
159 ; **UUID des Gewinnspiels:**
160 : Gibt die eindeutige UUID des Gewinnspiels aus um dieses identifizieren zu können.
161
162 ; **Online von:**
163 : Zeitpunkt, ab dem das Gewinnspiel online geschaltet wird. Falls die Option //**Aktiviert** (Das Gewinnspiel ist aufrufbar)// angewählt wurde, wird vor dem an dieser Stelle konfigurierten Zeitpunkt beim Öffnen des Gewinnspiels nur die //Ankündigung// des Gewinnspiels angezeigt. Sofern //Gewinnspiel im Portal anzeigen// angewählt wurde, wird das Gewinnspiel auch vor dem hier konfigurierten Zeitpunkt bereits im Gewinnspiel-Portal angezeigt. Auch in diesem Fall wird beim Öffnen des Gewinnspiels die //Ankündigung// gezeigt.
164
165 ; **Online bis:**
166 : Zeitpunkt, ab dem das Gewinnspiel offline geschaltet wird. Falls die Option //**Aktiviert** (Das Gewinnspiel ist aufrufbar)// angewählt wurde, wird ab dem an dieser Stelle konfigurierten Zeitpunkt beim Öffnen des Gewinnspiels nur die //Abgelaufen//-Mitteilung des Gewinnspiels angezeigt. Sofern //Gewinnspiel im Portal anzeigen// angewählt wurde, wird das Gewinnspiel auch vor dem hier konfigurierten Zeitpunkt bereits im Gewinnspiel-Portal angezeigt. Auch in diesem Fall wird beim Öffnen des Gewinnspiels die //Ankündigung// gezeigt.
167
168 ; **Layout:**
169 : An dieser Stelle kann über 5 Buttons konfiguriert werden, ob und wenn ja an welcher Stelle der konfigurierte //Beschreibungstext// angezeigt werden soll. Zur Auswahl stehen:
170 :; **Formular links**
171 :: Der //Beschreibungstext// wird rechts neben dem Formular angezeigt
172 :; **Formular rechts**
173 :: Der //Beschreibungstext// wird links neben dem Formular angezeigt
174 :; **Formular oben**
175 :: Der //Beschreibungstext// wird unter dem Formular angezeigt
176 :; **Formular unten**
177 :: Der //Beschreibungstext// wird über dem Formular angezeigt
178 :; **ohne Beschreibung**
179 :: Es wird nur das Formular und kein //Beschreibungstext// angezeigt
180
181 {{figure image="gs_microsite_de.png" clear="h2"}}
182 Mögliche Optionen zum Öffnen des Gewinnspiels bzw. zum Generieren von Code zum Einbetten des Gewinnspiels im Punkt //Microsite//
183 {{/figure}}
184
185 ; **Microsite**
186 : An dieser Stelle werden drei Schaltflächen angezeigt, mit denen das ausgewählte Gewinnspiel geöffnet oder ein Link zum Gewinnspiel ermittelt werden kann. Die Buttons haben dabei die folgenden Funktionen:
187 :; **Öffnen**
188 :: Öffnet das Gewinnspiel so, wie es aktuell sichtbar ist. Dabei werden alle durch das Gewinnspiel konfigurieten Inhalte angezeigt. Die durch das Gewinnspiel-Portal bereitgestellten Inhalte wie Kopfbereich, Furßbereich, usw. werden nicht mit dargestellt.
189 :; **Vorschau**
190 :: Selbe Funktion wie die //Öffnen//-Schaltfläche, allerdings wird das Formular im Vorschaumodus geöffnet. Beim Absenden des Formulars wird inneralb des zuvor vom Formualar verwendeten Bildschirmbereichs die Zusammenfassung über die an den Server übertragenen Daten angezeigt, welche auch bei einem normalen {{formcycle/}}-Formular nach dem Absenden aus der Vorschau angezeigt. Am rechten Rand der Schaltfläche kann durch den Klick auf den nach unten gerichteten Pfeil ein Menü geöffnet werden, welches zwei weitere Vorschau-Optionen enthält. Diese sind:
191 :; **Vorschau als angekündigt**
192 :: Öffnet das Gewinnspiel so, wie es sichtbar ist, wenn der Zeitpunkt ab dem es online ist noch nicht erreicht wurde.
193 :; **Vorschau als abgelaufen**
194 :: Öffnet das Gewinnspiel so, wie es sichtbar ist, wenn der Zeitpunkt bis zu dem es online war überschritten wurde.
195 :; **Bereitstellen**
196 :: Öffnet einen Dialog, in dem die URL zum Öffnen des Gewinnspiels ermittelt werden kann. Hierbei können die folgenden Optionen konfiguriert werden, welche das Aussehen des Gewinnspiels beeinflussen:
197 ::; **Kopfbereich des Gewinnspiels ausblenden (Bilder)**
198 ::: Wenn diese Option gewählt wird, wird die Bannergrafik nicht angezeigt.
199 ::; **Beschreibung des Gewinnspiels ausblenden**
200 ::: Wenn diese Option gewählt wird, wird die Beschreibung des Gewinnspiels nicht angezeigt, unabhängig davon, was unter //Layout// konfiguriert wurde.
201 ::; **Fußbereich des Gewinnspiels ausblenden (Datenschutz & Teilnahmebedingungen)**
202 ::: Wenn diese Option gewählt wird, werden die für das Gewinnspiel konfigurierten Inhalte für //Datenschutz// und //Teilnahmebedingungen// nicht angezeigt.
203 ::; **Zu verwendender Server**
204 ::: Auswahl, über welchen Server das Gewinnspiel geöffnet werden soll. Zur Auswahl stehen Master- und eventuell vorhande Frontend-Server.
205 :: Darunter wird die sich aufgrund der selektierten Optionen ergebende URL angezeigt. Durch einen Klick auf die //Quellcode kopieren//-Schaltfläche rechts kann diese in die Zwischenablage kopiert werden.
206 :: Alternativ kann durch einen Klick auf den nach unten gerichteten Pfeil am rechten Rand der Schaltfläche ein Menü geöffnet werden, welches drei weitere Optionen enthält. Diese öffnen jeweils einen Dialog, dessen Konfigurationsmöglichkeiten den bereits beschriebenen entsprecht. Anstelle einer URL werden allerdings in eine Webseite einzufügende Inhalte zum Einbinden des Gewinnspiels angezeigt. Die drei Optionen sind:
207 :; **Bereitstellen als HTML Link**
208 :: Generiert Quellcode, mit dem das Gewinnspiel direkt als HTML-Code in eine Webseite eingebunden werden kann.
209 :; **Bereitstellen als Inlineframe**
210 :: Generiert Quellcode, mit dem das Gewinnspiel als Inlineframe in eine Webseite eingebunden werden kann.
211 :; **Bereitstellen als Ajax/JavaScript**
212 :: Generiert Quellcode, mit dem das Gewinnspiel per Ajax (JavaScript) in eine Webseite eingebunden werden kann.
213
214 {{figure image="gs_inhalt_de.png" clear="h2"}}
215 Quellcode-Ansicht eines Editors im Reiter //Teilnahmebedingungen// von //Inhalt//.
216 {{/figure}}
217
218 ; **Inhalt**
219 : An dieser Stelle wird der eigentliche Inhalt des Gewinnspiels konfiguriert. Die einzelnen Inhaltselemente des Gewinnspiels können über die oben befindlichen Schaltflächen ausgewählt werden. Danach kann in dem darunter befindlichen WYSIWYG-Editor der jeweilige Inhalt eingefügt werden. Bei den HTML-Inhalten kann durch einen Klick auf //Quellcode// jeweils in die Quellcodeansicht gewechselt werden. Hierdurch können zum Beispiel für bestimmte Inhalte auch eigene IDs oder CSS-Klassen genutzt werden. Falls das Gewinnspiel nicht im Portal geöffnet werden soll, aber zusätzlicher JavaScript- und CSS-Code dafür benötigt wird, kann dieser unter //JavaScript (Microsite)// bzw. unter //CSS (Microsite)// definiert werden.
220 : Folgende Inhalte können an dieser Stelle konfiguriert werden:
221 :; **Beschreibung**
222 :: Beschreibungstext zum Gewinnspiel. Wird neben bzw. über oder unter dem Formular angezeigt.
223 :; **Teilnahmebedingungen**
224 :: Teilnahmebedingungen des Gewinnspiels. Wird im Portal unterhalb des Trenners neben dem //Datenschutz// angezeigt.
225 :; **Datenschutz**
226 :: Datenschutzbedingungen des Gewinnspiels. Wird im Portal unterhalb des Trenners neben den //Teilnahmebedingungen// angezeigt.
227 :; **Ankündigung**
228 :: Inhalt, welcher anstelle vom Formular und dem Beschreibungstext angezeigt wird, wenn das Gewinnspiel noch nicht gestartet ist.
229 :; **Abgelaufen**
230 :: Inhalt, welcher anstelle vom Formular und dem Beschreibungstext angezeigt wird, nachdem das Gewinnspiel beendet wurde.
231 :; **CSS (Microsite)**
232 :: Zusätzlicher CSS-Code, welcher nur für dieses Gewinnspiel verwendet werden soll.
233 :; **JavaScript (Microsite)**
234 :: Zusätzlicher JavaScript-Code, welcher nur für dieses Gewinnspiel verwendet werden soll.
235 :; **HTML header (Microsite)**
236 :: Zusätzlicher HTML-Code, welcher nur im Headerbereich dieses Gewinnspiels verwendet werden soll. Dies können zum Beispiel Metadaten oder Verweise auf andere CSS- oder JavaScript-Dateien sein.
237
238 {{figure image="gs_bannergrafiken_de.png" clear="h2"}}
239 Vorhandene Schaltflächen unter //Bannergrafiken//.
240 {{/figure}}
241
242 ; Bannergrafiken
243 : Oben rechts können die auf der Gewinnspiel-Portalseite beim Auswählen dieses Gewinnspiels und auf der Microsite angezeigten Bannergrafiken konfiguriert werden. Für unterschiedliche Geräteklassen bzw. Bildschirmauflösungen können dabei verschiedene Grafiken genutzt werden. Zur Auswahl stehen die folgenden Größen:
244 :: **Desktop** - ab 1026 px Bildschirmbreite; Muss konfiguriert werden
245 :: **Tablet** - zwischen 642 px und 1025 px Bildschirmbreite
246 :: **Mobile** - bei 641 px oder weniger Bildschirmbreite
247 : Wenn eine Bannergrafik für eine Geräteklasse nicht explizit konfiguriert wird, wird bei der Anzeige die Grafik des nächstgrößeren Formats verwendet. Dementsprechend sollte die Grafik für //Desktop// immer konfiguriert werden, während //Tablet// und //Mobile// optional sind. Unterstützt werden alle im Browser zulässigen Bildformate.
248
249 : Die folgenden Schaltflächen dienen der Konfiguration der Bannergrafiken:
250 :; **Desktop**, **Tablet** und **Mobile**
251 :: Durch anklicken dieser Schaltflächen kann zwischen den Grafiken für die einzelnen Geräteklassen gewchselt werden
252 :; **+ Bannergrafik ändern**
253 :: Öffnet einen Dateiauswahldialog zum selektieren einer lokal gespeicherten Grafik. Nach dem Bestätigen der Auswahl wird die Datei hochgeladen. Falls bereits zuvor eine Grafik vorhanden war, wird dieser ersetzt.
254 :; {{ficon name="trash-alt2"/}}-Symbol rechts neben dem Dateinamen einer bereits vorhandenen Grafik
255 :: Löschen der Grafik
256
257 ==== Fußzeile ====
258
259 Hier befinden sich die folgenden zwei Schaltflächen:
260
261 ; **Formular bearbeiten**
262 : Öffnet den Formulardesigner für den Formularteil des Gewinnspiels. Da es sich um ein normales {{formcycle/}}-Formular handelt, erfolgt die Erstellung und Konfiguration des Formulars analog. Vom Designer aus kann dementsprechend auch die Statusverarbeitung des Formulars konfiguriert werden.
263
264 ; **Speichern**
265 : Speichert die auf dieser Seite gemachten Einstellungen bzw. Änderungen an den Einstellungen.
266 \\\\{{id name="backend_vorlagen"/}}
267
268 === Vorlagen verwalten ===
269
270 {{figure image="vorlagen_ui_de.png" clear="h2"}}
271 Verwaltungsoberfläche für den Menüpunkt //Vorlagen verwalten//.
272 {{/figure}}
273
274 Unter diesem Menüpunkt können die vorhandenen Vorlagen für Gewinnspiele verwaltet und neue Vorlagen angelegt werden. An der Oberfläche kann eine Teilmenge der bei //Gewinnspiele verwalten// vorhandenen Optionen konfiguriert werden.
275
276 ==== Menü ====
277
278 Auf der linken Seite befindet sich die Liste aller vorhandenen Vorlagen. Über die Schaltfläche {{ficon name="plus-circle-outline"/}} über der Liste kann eine neue Vorlage angelegt werden, indem ein zuvor exportiertes Gewinnspiel oder eine zuvor exportierte Vorlage wieder importiert wird. Eine vorhandene Vorlage kann mit der sich daneben befindenden Schaltfläche {{icon name="fa-files-o" title="Kopieren" size="1x" cssClass="fa-files-o"/}} kopiert, mit {{icon name="fa-download" title="Exportieren" size="1x" cssClass="fa-download"/}} exportiert und mit {{ficon name="trash-alt2"/}} gelöscht werden. Über die Suchen-Schaltfläche {{icon name="fa-search" title="Suchen" size="1x" cssClass="fa-search"/}} kann ein Eingabefeld eingeblendet werden, nach dessen Inhalt die Vorlagen-Liste automatisch gefiltert wird.
279
280 ==== Einstellungen ====
281
282 Nachdem eine Vorlage angelegt bzw. in der Liste ausgewählt wurde, erscheint rechts die Konfigurationsseite für diese. Die foldenden Optionen können konfiguriert werden:
283
284 ; **Name der Vorlage:**
285 : Innerhalb von {{formcycle/}} angezeigter Name der Vorlage.
286
287 ; **Layout:**
288 : An dieser Stelle kann über 5 Buttons konfiguriert werden, ob und wenn ja an welcher Stelle der konfigurierte //Beschreibungstext// angezeigt werden soll. Zur Auswahl stehen:
289 :; **Formular links**
290 :: Der //Beschreibungstext// wird rechts neben dem Formular angezeigt
291 :; **Formular rechts**
292 :: Der //Beschreibungstext// wird links neben dem Formular angezeigt
293 :; **Formular oben**
294 :: Der //Beschreibungstext// wird unter dem Formular angezeigt
295 :; **Formular unten**
296 :: Der //Beschreibungstext// wird über dem Formular angezeigt
297 :; **ohne Beschreibung**
298 :: Es wird nur das Formular und kein //Beschreibungstext// angezeigt
299
300 ; **Microsite**
301 : An dieser Stelle wird nur eine Schaltflächen angezeigt, mit der die ausgewählte Vorlage wie ein normales Gewinnspiel im Vorschaumodus geöffnet werden kann. Der Button hat dabei die folgenden Funktionen:
302 :; **Vorschau**
303 :: Die Gewinnspiel-Vorlage bzw. das Formular wird im Vorschaumodus geöffnet. Beim Absenden des Formulars wird inneralb des zuvor vom Formualar verwendeten Bildschirmbereichs die Zusammenfassung über die an den Server übertragenen Daten angezeigt, welche auch bei einem normalen {{formcycle/}}-Formular nach dem Absenden aus der Vorschau angezeigt. Am rechten Rand der Schaltfläche kann durch den Klick auf den nach unten gerichteten Pfeil ein Menü geöffnet werden, welches zwei weitere Vorschau-Optionen enthält. Diese sind:
304 :; **Vorschau als angekündigt**
305 :: Öffnet die Gewinnspiel-Vorlage so, wie das Gewinnspiel sichtbar ist, wenn der Zeitpunkt ab dem es online ist noch nicht erreicht wurde.
306 :; **Vorschau als abgelaufen**
307 :: Öffnet die Gewinnspiel-Vorlage so, wie das Gewinnspiel sichtbar ist, wenn der Zeitpunkt bis zu dem es online war überschritten wurde.
308
309 {{figure image="gs_inhalt_de.png" clear="h2"}}
310 Quellcode-Ansicht eines Editors im Reiter //Teilnahmebedingungen// von //Inhalt//.
311 {{/figure}}
312
313 ; **Inhalt**
314 : An dieser Stelle wird der eigentliche Inhalt der Gewinnspiel-Vorlage konfiguriert. Die vorhandenen Optionen entsprechen exakt dem, was im Menüpunkt //Gewinnspiele verwalten// konfiguriert werden kann. Die einzelnen Inhaltselemente der Gewinnspiel-Vorlage können über die oben befindlichen Schaltflächen ausgewählt werden. Danach kann in dem darunter befindlichen WYSIWYG-Editor der jeweilige Inhalt eingefügt werden. Bei den HTML-Inhalten kann durch einen Klick auf //Quellcode// jeweils in die Quellcodeansicht gewechselt werden. Hierdurch können zum Beispiel für bestimmte Inhalte auch eigene IDs oder CSS-Klassen genutzt werden. Falls das in der Gewinnspiel-Vorlage konfigurierte Gewinnspiel später nicht im Portal geöffnet werden soll, aber zusätzlicher JavaScript- und CSS-Code dafür benötigt wird, kann dieser unter //JavaScript (Microsite)// bzw. unter //CSS (Microsite)// definiert werden.
315 : Folgende Inhalte können an dieser Stelle konfiguriert werden:
316 :; **Beschreibung**
317 :: Beschreibungstext der Gewinnspiel-Vorlage. Wird neben bzw. über oder unter dem Formular angezeigt.
318 :; **Teilnahmebedingungen**
319 :: Teilnahmebedingungen der Gewinnspiel-Vorlage. Wird im Portal unterhalb des Trenners neben dem //Datenschutz// angezeigt.
320 :; **Datenschutz**
321 :: Datenschutzbedingungen der Gewinnspiel-Vorlage. Wird im Portal unterhalb des Trenners neben den //Teilnahmebedingungen// angezeigt.
322 :; **Ankündigung**
323 :: Inhalt, welcher anstelle vom Formular und dem Beschreibungstext angezeigt wird, wenn das Gewinnspiel noch nicht gestartet ist.
324 :; **Abgelaufen**
325 :: Inhalt, welcher anstelle vom Formular und dem Beschreibungstext angezeigt wird, nachdem das Gewinnspiel beendet wurde.
326 :; **CSS (Microsite)**
327 :: Zusätzlicher CSS-Code, welcher nur für diese Gewinnspiel-Vorlage verwendet werden soll.
328 :; **JavaScript (Microsite)**
329 :: Zusätzlicher JavaScript-Code, welcher nur für diese Gewinnspiel-Vorlage verwendet werden soll.
330 :; **HTML header (Microsite)**
331 :: Zusätzlicher HTML-Code, welcher nur im Headerbereich dieses Gewinnspiels verwendet werden soll. Dies können zum Beispiel Metadaten oder Verweise auf andere CSS- oder JavaScript-Dateien sein.
332
333 {{figure image="gs_bannergrafiken_de.png" clear="h2"}}
334 Vorhandene Schaltflächen unter //Bannergrafiken//.
335 {{/figure}}
336
337 ; Bannergrafiken
338 : Oben rechts können die auf der Gewinnspiel-Portalseite beim Auswählen dieses Gewinnspiels und auf der Microsite angezeigten Bannergrafiken für diese Gewinnspiel-Vorlage konfiguriert werden. Für unterschiedliche Geräteklassen bzw. Bildschirmauflösungen können dabei verschiedene Grafiken genutzt werden. Zur Auswahl stehen die folgenden Größen:
339 :: **Desktop** - ab 1026 px Bildschirmbreite; Muss konfiguriert werden
340 :: **Tablet** - zwischen 642 px und 1025 px Bildschirmbreite
341 :: **Mobile** - bei 641 px oder weniger Bildschirmbreite
342 : Wenn eine Bannergrafik für eine Geräteklasse nicht explizit konfiguriert wird, wird bei der Anzeige die Grafik des nächstgrößeren Formats verwendet. Dementsprechend sollte die Grafik für //Desktop// immer konfiguriert werden, während //Tablet// und //Mobile// optional sind. Unterstützt werden alle im Browser zulässigen Bildformate.
343
344 : Die folgenden Schaltflächen dienen der Konfiguration der Bannergrafiken:
345 :; **Desktop**, **Tablet** und **Mobile**
346 :: Durch anklicken dieser Schaltflächen kann zwischen den Grafiken für die einzelnen Geräteklassen gewchselt werden
347 :; **+ Bannergrafik ändern**
348 :: Öffnet einen Dateiauswahldialog zum selektieren einer lokal gespeicherten Grafik. Nach dem Bestätigen der Auswahl wird die Datei hochgeladen. Falls bereits zuvor eine Grafik vorhanden war, wird dieser ersetzt.
349 :; {{ficon name="trash-alt2"/}}-Symbol rechts neben dem Dateinamen einer bereits vorhandenen Grafik
350 :: Löschen der Grafik
351
352 ==== Fußzeile ====
353
354 Hier befinden sich die folgenden zwei Schaltflächen:
355
356 ; **Formular bearbeiten**
357 : Öffnet den Formulardesigner für den Formularteil der Gewinnspiel-Vorlage. Da es sich um ein normales {{formcycle/}}-Formular handelt, erfolgt die Erstellung und Konfiguration des Formulars analog. Vom Designer aus kann dementsprechend auch die Statusverarbeitung des Formulars konfiguriert werden.
358
359 ; **Speichern**
360 : Speichert die auf dieser Seite gemachten Einstellungen bzw. Änderungen an den Einstellungen.
361 \\\\{{id name="backend_portal"/}}
362
363 === Konfiguration ===
364
365 {{figure image="portal_ui_de.png" clear="h2"}}
366 Verwaltungsoberfläche für den Menüpunkt //Portal konfigurieren//.
367 {{/figure}}
368
369 In diesem Menüpunkt kann das Aussehen des Gewinnspiel-Portals angepasst werden. Die folgenden Reiter stehen für die Konfiguration des Portals zur Verfügung:
370
371 ; Kopfbereich
372 : Über dem Formular angezeigter Inhalt.
373
374 ; Trenner
375 : Bereich, welcher zwischen Formular/Beschreibung und den Teilnahmebedingungen/Datenschutz angezeigt wird.
376
377 ; Fußbereich
378 : Unter Teilnahmebedingungen/Datenschutz angezeigter Inhalt.
379
380 ; Abgelaufen-Overlay
381 : Hier kann eine Grafik definiert werden welche über der Bannergrafik bei einem abgelaufenen Gewinnspiel angezeigt wird.
382
383 ; CSS (Portal)
384 : Innerhalb des Gewinnspiel-Portals zu verwendender CSS-Code.
385
386 ; JavaScript (Portal)
387 : Innerhalb des Gewinnspiel-Portals zu verwendender JavaScript-Code.
388
389 ; HTML header (Portal)
390 : Zusätzlicher HTML-Code, welcher im Headerbereich des Gewinnspiel-Portals verwendet werden soll. Dies können zum Beispiel Metadaten oder Verweise auf andere CSS- oder JavaScript-Dateien sein.
391
392 == Speicherort der Inhalte des Gewinnspiel-Portals ==
393
394 Die unter //Konfiguration// getätigten Einstellungen werden in {{formcycle/}} als Dateien hinterlegt. Diese befinden sich unter [[Dateien und Templates>>doc:Formcycle.UserInterface.FilesAndTemplates.Files]].
395
396 **Es handelt sich um die folgenden Dateien:**
397 {{table dataTypeAlpha="0-1" preSort="0-asc" caption=""}}|=Dateiname|=Inhalt
398 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
399 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
400 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
401 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
402 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite{{/table}}
403
404 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
405 (((
406 |=Dateiname|=Inhalt
407 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
408 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
409 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
410 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
411 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
412 )))
413
414
415 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
416 (((
417 |=Dateiname|=Inhalt
418 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
419 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
420 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
421 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
422 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
423 )))
424
425
426 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
427 (((
428 |=Dateiname|=Inhalt
429 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
430 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
431 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
432 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
433 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
434 )))
435
436
437 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
438 (((
439 |=Dateiname|=Inhalt
440 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
441 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
442 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
443 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
444 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
445 )))
446
447
448 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
449 (((
450 |=Dateiname|=Inhalt
451 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
452 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
453 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
454 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
455 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
456 )))
457
458
459 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
460 (((
461 |=Dateiname|=Inhalt
462 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
463 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
464 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
465 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
466 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
467 )))
468
469
470 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
471 (((
472 |=Dateiname|=Inhalt
473 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
474 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
475 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
476 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
477 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
478 )))
479
480
481 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
482 (((
483 |=Dateiname|=Inhalt
484 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
485 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
486 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
487 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
488 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
489 )))
490
491
492 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
493 (((
494 |=Dateiname|=Inhalt
495 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
496 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
497 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
498 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
499 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
500 )))
501
502
503 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
504 (((
505 |=Dateiname|=Inhalt
506 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
507 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
508 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
509 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
510 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
511 )))
512
513
514 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
515 (((
516 |=Dateiname|=Inhalt
517 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
518 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
519 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
520 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
521 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
522 )))
523
524
525 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
526 (((
527 |=Dateiname|=Inhalt
528 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
529 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
530 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
531 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
532 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
533 )))
534
535
536 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
537 (((
538 |=Dateiname|=Inhalt
539 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
540 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
541 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
542 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
543 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
544 )))
545
546
547 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
548 (((
549 |=Dateiname|=Inhalt
550 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
551 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
552 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
553 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
554 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
555 )))
556
557
558 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
559 (((
560 |=Dateiname|=Inhalt
561 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
562 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
563 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
564 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
565 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
566 )))
567
568
569 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
570 (((
571 |=Dateiname|=Inhalt
572 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
573 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
574 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
575 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
576 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
577 )))
578
579
580 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
581 (((
582 |=Dateiname|=Inhalt
583 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
584 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
585 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
586 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
587 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
588 )))
589
590
591 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
592 (((
593 |=Dateiname|=Inhalt
594 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
595 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
596 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
597 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
598 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
599 )))
600
601
602 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
603 (((
604 |=Dateiname|=Inhalt
605 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
606 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
607 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
608 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
609 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
610 )))
611
612
613 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
614 (((
615 |=Dateiname|=Inhalt
616 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
617 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
618 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
619 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
620 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
621 )))
622
623
624 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
625 (((
626 |=Dateiname|=Inhalt
627 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
628 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
629 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
630 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
631 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
632 )))
633
634
635 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
636 (((
637 |=Dateiname|=Inhalt
638 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
639 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
640 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
641 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
642 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
643 )))
644
645
646 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
647 (((
648 |=Dateiname|=Inhalt
649 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
650 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
651 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
652 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
653 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
654 )))
655
656
657 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
658 (((
659 |=Dateiname|=Inhalt
660 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
661 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
662 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
663 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
664 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
665 )))
666
667
668 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
669 (((
670 |=Dateiname|=Inhalt
671 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
672 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
673 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
674 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
675 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
676 )))
677
678
679 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
680 (((
681 |=Dateiname|=Inhalt
682 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
683 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
684 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
685 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
686 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
687 )))
688
689
690 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
691 (((
692 |=Dateiname|=Inhalt
693 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
694 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
695 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
696 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
697 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
698 )))
699
700
701 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
702 (((
703 |=Dateiname|=Inhalt
704 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
705 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
706 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
707 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
708 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
709 )))
710
711
712 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
713 (((
714 |=Dateiname|=Inhalt
715 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
716 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
717 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
718 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
719 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
720 )))
721
722
723 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
724 (((
725 |=Dateiname|=Inhalt
726 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
727 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
728 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
729 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
730 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
731 )))
732
733
734 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
735 (((
736 |=Dateiname|=Inhalt
737 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
738 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
739 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
740 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
741 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
742 )))
743
744
745 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
746 (((
747 |=Dateiname|=Inhalt
748 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
749 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
750 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
751 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
752 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
753 )))
754
755
756 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
757 (((
758 |=Dateiname|=Inhalt
759 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
760 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
761 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
762 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
763 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
764 )))
765
766
767 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
768 (((
769 |=Dateiname|=Inhalt
770 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
771 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
772 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
773 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
774 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
775 )))
776
777
778 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
779 (((
780 |=Dateiname|=Inhalt
781 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
782 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
783 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
784 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
785 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
786 )))
787
788
789 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
790 (((
791 |=Dateiname|=Inhalt
792 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
793 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
794 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
795 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
796 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
797 )))
798
799
800 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
801 (((
802 |=Dateiname|=Inhalt
803 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
804 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
805 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
806 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
807 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
808 )))
809
810
811 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
812 (((
813 |=Dateiname|=Inhalt
814 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
815 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
816 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
817 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
818 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
819 )))
820
821
822 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
823 (((
824 |=Dateiname|=Inhalt
825 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
826 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
827 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
828 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
829 |contest-portal.title.html|Titel der Gewinnspiel-Portalseite
830 )))
831
832
833 (% class="xm-table xm-fw-false xm-fl-none" data-xm-table-dta="0-1" data-xm-table-ps="0-asc" %)
834 (((
835 |=Dateiname|=Inhalt
836 |contest-portal.css.txt|CSS-Code für das Gewinnspiel-Portal; Als txt-Datei hinterlegt, damit es nicht automatisch in alle Formulare eingebunden wird
837 |contest-portal.footer.html|Inhalt des Fußbereiches der Gewinnspiel-Portalseite
838 |contest-portal.header.html|Inhalt des Kopfbereiches der Gewinnspiel-Portalseite
839 |contest-portal.separator.html|Inhalt des Trenners in der Mitte auf der Gewinnspiel-Portalseite
840 |contest-portal.title.html|(((
841 Titel der Gewinnspiel-Portalseite
842 )))
843 )))
844
845 == JavaScript-Schnittstellen ==
846
847 === Allgemein ===
848
849 Allgemein stehen den Gewinnspielen sowohl in Kontext der Microsite als auch innerhalb des Portals folgende Funktionen zur Verfügung:
850
851 ==== Scrollen zum Seitenanfang: ====
852
853 {{code language="none"}}
854 // Innerhalb des Kontextes
855 Contest.scrollToTop();
856
857 // Innerhalb des Formulares
858 // - falls dies in der selben Domaine betrieben wird
859 window.parent.Contest.scrollToTop();
860
861 // - falls dies nicht in der selben Domaine betrieben wird
862 window.parent.postMessage('scrollToTop', '*');
863
864 // Allgemein ansprechbar über postMessage:
865 <window>.postMessage('scrollToTop', '*');
866 {{/code}}
867
868 ==== Scrollen zu den Teilnahmebedingungen: ====
869
870 {{code language="none"}}
871 // Innerhalb des Kontextes
872 Contest.scrollToTerms();
873
874 // Innerhalb des Formulares
875 // - falls dies in der selben Domaine betrieben wird
876 window.parent.Contest.scrollToTerms();
877
878 // - falls dies nicht in der selben Domaine betrieben wird
879 window.parent.postMessage('scrollToTerms', '*');
880
881 // Allgemein ansprechbar über postMessage:
882 <window>.postMessage('scrollToTerms', '*');
883 {{/code}}
884
885 ==== Scrollen zur Datenschutz-Erklärung: ====
886
887 {{code language="none"}}
888 // Innerhalb des Kontextes
889 Contest.scrollToPrivacy();
890
891 // Innerhalb des Formulares
892 // - falls dies in der selben Domaine betrieben wird
893 window.parent.Contest.scrollToPrivacy();
894
895 // - falls dies nicht in der selben Domaine betrieben wird
896 window.parent.postMessage('scrollToPrivacy', '*');
897
898 // Allgemein ansprechbar über postMessage:
899 <window>.postMessage('scrollToPrivacy', '*');
900
901 {{/code}}
902
903 === Portal-spezifisch ===
904
905 Innerhalb des Portals wird für die Carousel-Darstellung die Bibliothekt [[slick>>https://kenwheeler.github.io/slick/||rel="noopener noreferrer" target="_blank"]] verwendet. Dies lässt sich hierbei wie folgt ansprechen und umkonfigurieren:
906
907 {{code language="none"}}
908 // Abholen des entsprechenden Carousel-Objekts
909 var carousel = $('.portal-carousel-images');
910
911 // Beispielhafte konfiguration des Autoplay-Features
912 if (carousel && carousel.length > 0) {
913 carousel.slick('slickSetOption', 'speed', 1000)
914 carousel.slick('slickSetOption', 'autoplaySpeed', 5000);
915 carousel.slick('slickPlay');
916 }
917 {{/code}}
918
919 (% class="wikigeneratedid" id="HSelektioneinesbestimmtenGewinnspiels:" %)
920 Ferner lässt sich die wie folgt ein gewünschtes Gewinnspiel anhand der entsprechenden UUID selektieren:
921
922 {{code language="none"}}
923 // Innerhalb des Kontextes
924 Portal.goToContest(<uuid>);
925
926 // Innerhalb des Formulares
927 // - falls dies in der selben Domaine betrieben wird
928 window.parent.Portal.goToContest(<uuid>);
929
930 // - falls dies nicht in der selben Domaine betrieben wird
931 var data = {
932 msg: 'goToContest',
933 uuid: <uuid>
934 };
935 window.parent.postMessage(data, '*')
936
937 // Allgemein ansprechbar über postMessage:
938 var data = {
939 msg: "goToContest",
940 uuid: <uuid>
941 };
942 <window>.postMessage(data , '*')
943 {{/code}}
944
945 === Microsite-spezifisch ===
946
947 Die Microsite besitzt neben den allgemeinen Funkationalitäten einen postMessage-Proxy welcher alle Nachrichten an das Formular-Fenster weiterreicht. Ferner wird die Bibliothek [[iFrame Resizer>>https://github.com/davidjbradshaw/iframe-resizer||rel="noopener noreferrer" target="_blank"]] bereitgestellt.
948
949 == Einbinden als Microsite ==
950
951 Für die Integration einer Gewinnspiel-Microsite als IFrame stehen verschiedene Hilfsmethoden für das Anpassen der Fenstergröße sowie das Scrolling der Site zur Verfügung. Diese sind hierbei folgende:
952
953 ==== Resizing der IFrame anhand ihres Inhaltes ====
954
955 Hier kommt die Bibliothekt [[iFrame  Resizer>>https://github.com/davidjbradshaw/iframe-resizer||rel="noopener noreferrer" target="_blank"]] zum Einsatz. Es muss hierfür auf der Seite die die Microsite einbindet die Datei //iframeResizer.min.js// einbgebunden und der Resizer beispielsweise wie folgt initialisiert werden:
956
957 {{code language="none"}}
958 iFrameResize({log: false}, '<CSS-Selektor der iframe>');
959 {{/code}}
960
961 ==== Scrolling zu gewünschten Stellen auf der Microsite ====
962
963 Für diese Funktionalität werden an die Zielseite durch die Microsite entsprechende postMessages gesendet. Unter der Verwendung von [[jQuery>>https://jquery.com/||rel="noopener noreferrer" target="_blank"]] kann dessen Auswertung wie folgt stattfinden:
964
965 {{code language="none"}}
966 // Behandelt Messages der Microsite
967 function _handleMessage(event){
968
969 // Prüfung ob es sich um eine Scroll-Message handelt
970 if(event.data.scrollTarget || event.data.scrollOffset){
971
972 // Berechnung des Offsets der iFrame zum Seitenanfang. als scrollTarget sind die Werte "top", "terms" und "privacy" möglich.
973 var frameOffset = (event.data.scrollTarget == 'top') ? 0 : $('<CSS-Selektor der iFrame>').offset().top;
974
975 // Animiertes Scrolling zum Ziel. Dieses ergibt sich aus dem Offset der iFrame und dem Offset der Position innerhalb der iFrame
976 $('html, body').animate({
977 scrollTop : event.data.scrollOffset + frameOffset
978 }, 'slow');
979
980 // Weiterleitung aller weiteren postMessages an die Microsite
981 }else{
982 $('<CSS-Selektor der iFrame>').each(function(){
983 var iframewindow= this.contentWindow ? this.contentWindow : this.contentDocument.defaultView;
984 iframewindow.postMessage(event.data,location.origin);
985 });
986 }
987 }
988
989 // Registireren der Message-Behandlung
990 if (window.addEventListener) {
991 window.addEventListener('message', _handleMessage, false);
992 } else if (window.attachEvent) { // ie8
993 window.attachEvent('onmessage', _handleMessage);
994 }
995
996 {{/code}}
997
998 {{info}}
999 Wie in diesem Beispiel erkennbar werden alle nicht postMessage-Nachrichten der Zielseite an die Microsite weitergegeben. Dies ist wichtig um z.B. interne Resize-Nachrichten des Formulars bis in die Microsite zu geben!
1000 {{/info}}
1001
1002 == Versionshistorie ==
1003
1004 === 1.3.2 ===
1005
1006 * Korrektur falscher Bilder in der Lightbox der Gewinnspielübersicht
1007
1008 === 1.3.1 ===
1009
1010 * Über den Plugin-Parameter //portal.usebaseurl// kann aktiviert werden, dass für die Gewinnspiel-URLs die hinterlegten Basis-URLs benutzt werden.
1011 * Ausgabe der UUID des Gewinnspiels auf entsprechender Konfigurations-Seite
1012
1013 === 1.3.0 ===
1014
1015 * Fehlerbehebung beim Ausliefern über den Frontend-Server
1016 * Einbau eines iFrame-Resizer für Microseiten
1017 * Weitergabe von scroll-Nachrichten an top-window
1018
1019 === 1.2.4 ===
1020
1021 * Weiterleitung von postMessage an iframe innerhalb von Microsites
1022
1023 === 1.2.3 ===
1024
1025 * Durchreichen von URL-Parametern an IFames im Portal
1026 * Fix zum direkten Selektieren eines Gewinnspiels im Portal per URL-Parameter
1027
1028 === 1.2.2 ===
1029
1030 * Undo/Redo-Funktionalität an Editoren aktiviert
1031 * Zentral pflegbares Overlay für abgelaufene Gewinnspiele eingebaut
1032 * Kleinere Anpassungen/Bugfixes
1033
1034 === 1.2.0 ===
1035
1036 * Einbinden von grid.css auch in Portal- und Gewinnspiel-Text-Editoren
1037 * Überarbeitung des Portal-Layoutings und Anpassung responsiver Breakpoints
1038 * Separate Einbindung von jQuery um dass unnötigen Laden von Primefaces zu umgehen
1039
1040 === 1.1.0 ===
1041
1042 * Anpassungen für FORMCYCLE Version 6.5.x und PrimeFaces 8
1043
1044 === 1.0.1 ===
1045
1046 * Anpassungen für FORMCYCLE Version 6.4.x

Navigation

Copyright 2000-2025