Inhalt

Die Dokumentation ist unterteilt nach den Projekten
Wir über uns , Dialogkampagne , SeiGast und Gästeführer.


Wir Über uns

Seitennavigation Unten
3 Boxen
Unsere Werte
Unsere Ziele
Meilensteine
Aktionsangebote
Lange Box
Einleitung
Bild


dokumentation

Dialogkampagne

Events Backend Modul
Eventliste
Eventleser
Headerbild
Heading mit Text
Newsletter
Partner
Zwei Boxen


SeiGast und Gästeführer

Backend Modul Angebote
Backend Modul Infobanner
Angebote-Liste
Detailseite
Detailansicht Weitere Angebote
Datenimporteur
SeiGast - Headerbild
Testimonials
Wertschaetzung


dokumentation

Formulare

Formular - Dialogkampagne - Newsletter
Formular - Anmeldung Workshop (Neu)
Formular - Sei Gast - Angebotsanfrage
Formular - Sei Gast - Leistungsträger
Formular - Gästefuehrer - Aktionsführungen
dokumentation Formular - Gästefuehrer - Gästeführerwoche

dokumentation

Besonderheiten

Rich Text Editor (tinyMce)


Seite 1

Wir Über Uns

Seitennavigation Unten

Das Inhaltselement Seitennavigation Unten wird genutzt für die Navigation zwischen den 3 Seiten in der Aktion "Wir Über Uns".

Eingabemaske

Frontend

Besonderheiten

Im Element "Seitennavigation Unten" (über Auswahl Ändern)
können Bilder gewählt , sowie Titel und Overlaytext gesetzt werden (welche im Hoverzustand sichtbar werden).

Seite 2

3 Boxen

Das Inhaltselement 3 Boxen enthält Card Elemente , sowie ein Modal mit was sich bei Klick auf "Mehr erfahren" öffnet.

Eingabemaske

Frontend

Modal:

Besonderheiten

Über Seitennavigation Unten (Auswahl Ändern)
können Bilder gewählt , sowie Titel und Modaltext gesetzt werden.

Seite 3

Unsere Werte

Das Inhaltselement Unsere Werte erzeugt eine Kachelansicht mit Icon + Titel für jede Kachel.
Beim Hovern über eine Kachel wird ein Overlaytext angezeigt.

Eingabemaske

Frontend

Besonderheiten

Keine

Seite 4

Unsere Ziele

Das Inhaltselement Unsere Ziele besteht aus einem Bildelement , sowie einer Box mit einem Titel und einer Liste.

Eingabemaske

Frontend

Besonderheiten

In der Eingabemaske kann bestimmt werden ob das Bild links oder rechts angezeigt werden soll.

Seite 5

Meilensteine

Das Inhaltselement Meilensteine besteht aus einem Bildelementen(SVG) , sowie einem Titel und einem Beschreibungstext.

Eingabemaske

Frontend

Besonderheiten

Das Element besitzt eine Slider Funktion

Seite 6

Aktionsangebote

Das Inhaltselement Aktionsangebote besteht aus einem blauen Banner sowie Bilder + Beschreibungstextelementen.

Eingabemaske

Frontend

Besonderheiten

Keine

Seite 7

Lange Box

Das Inhaltselement Lange Box besteht aus einem Bild , Beschreibungstext und einem Call to Action Button für den ein Link gesetzt werden kann.

Eingabemaske

Frontend

Besonderheiten

Tipp:  Neben oder unter einem Linkfeld befindet sich oftmals
ein kleines blaues Icon. Damit kann ein Picker aufgerufen werden womit man eine Seite aus der Seitenstruktur wählen kann.
Man kann den gewählten Seitenlinks dort dann auch eine Sprungmarke anhängen indem man zum Schluss #hier_deine_sprungmarke  ins Textfeld schreibt. 
Manchen Inhaltselementen haben die Option zum setzen einer Sprungmarke. Sodass man über das Linkfeld zu Inhaltselementen Springen lassen kann.

Seite 8

Einleitung

Das Inhaltselement Einleitung besteht aus einem Seitentitel , einer Überschrift sowie einem kleinen Pfeilicon . Es wird als erstes Element der Seite eingesetzt.

Eingabemaske

Frontend

Besonderheiten

Keine

Seite 9

Bild

Das Inhaltselement Bild besitzt eine lazyloading Funktion und einer Auswahl für die Bildgrösse.

Eingabemaske

Frontend

Besonderheiten

Dieses Element sollte nur in Ausnahmefällen eingesetzt werden.
Da für Bilder unter Bildgrössen im Backend  in der Regel eine genaue Bildgrösse angelegt sein sollte. Vorhandene Bildgrössen können aber genutzt werden.
Bildgrösse sollte ausgewählt werden für die Optimierung der Dateigrösse / Pagespeed.
Bei  SVG's kann man dies vernachlässigen , aber bei besonders grossen Bildern / Dateigrössen ist es wichtig das Contao die Bildgrösse vorher optimiert. 

Seite 10

Dialogkampagne

Events

Beschreibung

Das Backend Modul Events basiert auf dem offiziellen ContaoCalendar Bundle.Das Modul wurde erweitert.Für die anzeige von Events wird über die Artikel Funtkion ein Eventlisten Frontend Modul eingebunden welches die Events im Frontend ausgibt. Im Eventlisten Modul bestimmt man wo sich das dazugehörige Event-Reader Modul befindet , welches dafür zuständig die dazugehörige Detailseiten anzuzeigen.

Modulart

Offizielles Contao Modul

Github Contao Calender 4.9

Eingabemaske

Bearbeitbare Datensätze aus dem Events Modul

Datum und Zeiteinstellungen

Heremaps Einstellungen


Seite 11

Frontend

Listenansicht

Detailansicht eines Listenelements

Bearbeitung und Duplikation

Eventlisten / EventReader können flexibel auf mehreren Seiten eingebunden werden.

Besonderheiten

Backend Modul : Events
Frontend Modul : Eventliste
Frontend Modul: Eventreader-ext
Für den Eventreader wird das Modul eventreader-ext verwendet !

Seite 12

Eventliste

Das Modul Eventliste zeigt Events aus dem Backend Modul Events an. Einstellungsmöglichkeiten für Datum , Anzahl , Reihenfolge bietet das offizielle Contao Modul. Weitere Felder für die Listen und Detailansicht wurden hinzugefügt.

Eingabemaske

Modulauswahl über Artikel

Modulkonfiguration

Frontend

Listenansicht


Seite 13

Besonderheiten

Die Listenansicht besitzt eine toggle Funktion. Auf einer Seite werden dafür jeweils 2 Eventlisten eingebunden. 
Jeweils eine Eventliste für laufende und vergangene Veranstaltungen. Die Modul-Einstelllung für das Anzeigeformat unterscheiden sich dabei.
Für laufende Veranstaltungen die CSS Klasse laufende_eventliste in den Experteneinstellungen eintragen.
Für vergangene Veranstaltungen die CSS Klasse vergangene_eventliste in den Experteneinstellungen eintragen.
Wichtig: Detailseite auswählen.
Wichtig: bei Kalender die Kategorie / Kategorien auswählen.

Seite 14

Eventleser

Das Modul Eventleser gibt die Detailseite eines Listenelements aus.

Eingabemaske

Modulauswahl über Artikel

Modulkonfiguration

Frontend

Detailansicht:

Besonderheiten

Die Inhalte der Detailansicht werden im Eventlistenmodul eingetragen.
Im Reiter Modulkonfiguration -> Kalender die Kategorie/Kategorien zur Ausgabe auswählen

Seite 15

Headerbild

Im Inhaltselement Headerbild können Buttontexte und Buttonlinks konfiguriert werden , sowie ein zentriertes und ein unten rechts ausgerichtetes SVG Logo eingefügt werden.

Eingabemaske

Modulauswahl über Artikel

Haupt und Neben SVG:

Frontend

Detailansicht:

Besonderheiten

Keine

Seite 16

Heading mit Text

Das Inhaltselement Heading mit Text ist ein einfaches Element mit einer Überschrift + Subtext. Es wird der Angebote-Liste kombiniert und besitzt die selbe graue Hintergrundfarbe.

Eingabemaske

Frontend

Besonderheiten

Wird zusammen mit dem Angebote Liste Element eingesetzt.

Seite 17

Newsletter

Das Inhaltselement Newsletter übergibt eine Email Adresse an die newsletter.html
Seite.

Eingabemaske

Frontend


Seite 18

Besonderheiten

Das Feld "Quelle für Maileon" füllt der TMV
aus um in Maileon filtern zu können von welcher Seite die Newsletter anmeldung stammt.
Default Quelle für die Newsletter Anmeldung (/newsletter.html) lautet
wsu_newsletterregistrierung
Quelle über den Footer lautet 
wsu_webfooter
Quelle über das Newsletter Inhaltselement (was in der Dialogkampagne genutzt wird )lautet z.B
wsu_dialogkampagne

Seite 19

Partner

Das Inhaltselement Partner besteht aus Icons und Titeln. Es wird eingesetzt für Erwähnung von Partnern.

Eingabemaske

Frontend

Besonderheiten

Keine

Seite 20

Zwei Boxen

Das Inhaltselement Zwei Boxen ermöglicht die Eingabe von Text oder sonstigen Inhalten über einen Rich-Text-Editor.

Eingabemaske

Frontend

Besonderheiten

Über den Rich-Text-Editor können Text , Farben , Abstände frei konfiguriert werden.
Der Rich-Text-Editor wurde erweitert. Dadurch findet man über die Farbauswahl die Themen Farben Orange , Blau

Seite 21

Sei Gast

Backend Modul Angebote

Beschreibung

Das Backend Modul Angebote ist eine Eigenentenwicklung. Für das Modul ist es angedacht das vom TMV Kategorien anlegt werden.
Live Kategorien werden vom TMV angelegt z.b "Live - Woche der Führungen 2023".
Sofern die Aktion ein Formular besitzt legen Entwickler zusätlich eine Prüfungskategorie an. Z.b "Prüfung - Gästeführerformular".
Der Datenimporteur überträgt Datensätze in die Prüfungskategorien. Der TMV prüft und vervollständigt diese und verschiebt Datensätze von einer Prüfungskategorie zu einer Live Kategorie.

Modulart

Eigententwicklung

Eingabemaske

Live und Prüfungs Kategorien:

Frontend

Kategorieansicht (Angebote-Liste Inhaltselement):


Seite 21

Bearbeitung und Duplikation

Das Angebote Modul erlaubt es Listen und Detailseiten zu bearbeiten. Listen und Detailseiten können beliebig oft über die entsprechenden Inhaltselemente in der Seitenstruktur eingebunden werden.Für Detailseiten ist festgelegt das diese mit dem Seitenalias /details enden müssen.

Besonderheiten

Detailseiten müssen mit dem Seitenalias /details enden.
Zusammenspiel mit Datenimporteur. Datensätze werden bei Formularübertragung in eine Prüfungskategorie gespeichert.
Ein Entwickler muss für weitere Formulare  im Datenimporteur das Mapping anlegen für Formular zu Datenbank.
Backend Modul : Angebote
Inhaltselement : Angebote-Details
Inhaltselement: Detailansicht Weitere Angebote

Seite 22

Angebote Liste

Das Inhaltselement Angebote Liste gibt die Datensätze aus dem Backendmodul Angebote in Listenform aus.
Es verfügt über eine Kategorieauswahl und Einstellungen um Filter im Fronted ein/auszublenden.

Eingabemaske

Einstellungen Angebote Liste:

Frontend

Angebote Liste:


Seite 23

Besonderheiten

Bitte zugehörige Detailseite auswählen welche das Details Inhaltselement eingebunden hat
Das "Detailseite" Inhaltselement wird zusammen mit dem "Detailansicht weitere Angebote" Inhaltselement eingesetzt.
Beim den Einstellung für das Weitere Angebote Inhaltselement auch nochmal die Detailseite auswählen
Entwicklerhinweis :  values für  Formularfelder aus dem Formulargenerator sind identisch mit DCA values des Angebote Moduls.
Wichtig damit Daten aus Angebote , Datenimporteur konsistent sind und die Filterung im Frontend funktioniert.

(Datenabgleich der Filterlogik erfolgt via Javascript über data-attribute).
Für die Bilder der Listenansicht ist eine Bildgrösse hinterlegt.

Seite 24

Detailseite

Das Inhaltselement Detailseite gibt Bild , Text , Karte , sowie weitere Informationen aus.

Eingabemaske

Inhaltselement

Angebote Modul (Eingabemaske für Angebote Details und Angebot-Liste)

Frontend

Angebote Details:


Seite 25

Besonderheiten

Bitte zugehörige Detailseite auswählen mit eingebundenen Details Inhaltselement.

Detailansicht Weitere Angebote

Das Inhaltselement Detailansicht Weitere Angebote gibt 3 züfällige Angebote aus.

Eingabemaske

Inhaltselement

Frontend

Weitere Angebote:

Besonderheiten

Das Inhaltselement  "Detailansicht weitere Angebote" wird über die Artikelfunktion unten dem Inhaltselement Detailansicht eingebunden.
In der Eingabemaske Detailseite auswählen !
In der Eingabemaske Angebotskategorie auswählen !

Seite 26

SeiGast Headerbild

Das Inhaltselement SeiGast Headerbild nimmt den vollen Viewport ein. Das Element besitzt eine Überschrift + Subtext , ausserdem 2 Button und 2 Logos unten Rechts.

Eingabemaske

Inhaltselement

Frontend

Weitere Angebote:


Seite 27

Besonderheiten

Für das Inhaltselement ist die Bildgrösse "Headerbild hinterlegt"
Für die Buttons können Links gesetzt werden

Seite 28

Testimonials

Das Inhaltselement Testimonials besteht aus einem Bild + Text + Subtext.

Inhaltselement

Frontend

Weitere Angebote:

Besonderheiten

Headline wählbar (H1,H2,H3)
Mehrfachauswahl über fine-uploader ( Dateien Hochladen und Auswahl ändern)

Seite 27

Wertschaetzung

Das Inhaltselement Wertschaetzung besteht aus einem Titel , Subtext und Button. Ausserdem sind links und rechts jeweils ein SVG. Der Hintergrund des Inhaltselements ist blau gefärbt. Es wird zu dem Zweck Aufmerksamkeit zu erlangen eingesetzt.

Inhaltselement

Frontend

Weitere Angebote:

Besonderheiten

Headline wählbar (H1,H2,H3)

Seite 29

Datenimporteur - (SeiGast , Gästeführer)

Der Datenimporteur ist ein Contao Hook.
In dem Hook gibt es ein Mapping um die Information aus den Formularfeldern zu Datenbankfeldern zu übertragen.

Modulart

Eigenentwicklung

Ausschnitt Datenbank Mapping

Live und Prüfungs Kategorien:

Bearbeitung und Duplikation

Für weitere Prüfungskategorien des Angebote Moduls , muss der Datenimporteur erweitert werden und das Mapping angepasst werden , damit Datensätze von Formular in der neuen Kategorie auftauchen.
Prüfungskategorien Stand Januar 2023:
Prüfung - Gästeführerformular (ID 6)
Prüfung - Leistungsträgerformular (ID 5)

Seite 30

Backend Modul Infobanner

Ermöglicht Infobanner unter der Navigation einzublenden mit User definierten Text.

Eigenentwicklung

Besonderheiten

Unterstützt:
Seiten
Angebote Detailseiten
Events
Themenseiten
Angebote Detailseiten müssen mit dem Seitenalias /details enden.
z.B 
informieren/sei-gast-auf-deiner-eigenen-insel/details
informieren/woche-der-fuehrungen/details

Seite 31

Formulare

Newsletter Anmeldung

In Formular Newsletter befindet sich ein Checkbox-Formularfeld
"newsletter". Sofern im Frontend die Newsletter Checkbox angehakt wurde ,
wird das TMVMaileonBundle ausgelöst. Sofern Anmeldedaten für Maileon hinterlegt werden in den Formulareinstellungen wird  eine Newsletter-Anmeldung bei Formularübertragung durchgeführt.

Anfragen Speicherung

Bei Formularübermittlung werden die Formulardaten gespeichert.
Diese kann man im Backend im Reiter Anfragen auf der linken Seite einsehen.


Formulare Dialogkampagne

Newsletter

Das Formular "Newsletter"  befindet sich auf der Hauptseite für Newsletter Anmeldungen /newseletter.html.

Dialogkampagne - Newsletter

Das Formular "Dialogkampagne - Newsletter" wird im Inhaltselement Newsletter eingesetzt für die Formularübermittlung vom Inhaltselement zu /newsletter.html Seite

Anmeldung Workshop

Das Formular "Anmeldung Workshop" wird auf
der Seite engagieren/ideen-machen-tourismus.html (für Workshops Events) eingesetzt.

Seite 32

Formulare Sei Gast

Leistungsträger

Im Leistungsträgerformular erstellen Leistungsträger Angebote.Diese werden bisher auf der Seite informieren/sei-gast-auf-deiner-eigenen-insel ausgespielt, nach Prüfung vom TMV.

Angebotsanfrage

Das Anbgebotsanfragen Formular befindet sich auf den Detailseiten für SeiGast. Das Formular wird angezeigt wenn eine Anmeldung oder Reservierung für ein Angebot erforderlich ist (auf Detailseiten).


Seite 33

Formulare Gästeführerwoche

Aktionsführungen

Angebotsanfrage






Seite 34

Besonderheiten

Richt Text Editor

Der Rich Text Editor (tinyMce)

Über folgenden Button kann der Quelltext bearbeitet werden.

Um einen Button zu erzeugen welcher ein Popup für die Anmeldung zur Dialogplattform aufruft können folgende Button Codes verwendet werden :

Button Infolink Orange

<p class="login_wrapper"><a class="button light orange login" href="#">anmelden</a></p>

Button Infolink Blau

<p class="login_wrapper"><a class="button light blue login" href="#">anmelden</a></p>

Button CTA Orange

<p class="login_wrapper"><a class="button login" href="#">anmelden</a></p>

Button CTA Blau

<p class="login_wrapper"><a class="button blue login" href="#">anmelden</a></p>

Stand Februar 2023

</body> </html>