Modulares Design
Durch das modulare Design kann eine HTML Struktur innerhalb von Typo3 aufgebaut werden. Dadurch können z.B. Bootstrap Elemente nachgebaut werden,um darin Typo3 Content Elemente und andere Plugins verwenden zu können.
Im Beispiel: Bootstrap Panels mit Elementen der Shop Extension darin.
Teens Kurs
Jugendliche sind am liebsten mit Gleichgesinnten zusammen. Das gilt natürlich auch für die Piste!
Teens Kurs
Jugendliche sind am liebsten mit Gleichgesinnten zusammen. Das gilt natürlich auch für die Piste!
Erwachsenenkurs
Sicheres Lernen mit Spaß und Abwechslung. Für jene, denen die Geselligkeit im Urlaub nicht fehlen darf, bieten wir für alle Könner-Stufen passende Gruppenkurse an.
Privatunterricht
Ob alleine, mit Freunden oder der Familie – Ihr Ski-, Snowboard- oder Langlauflehrer kümmert sich ganz individuell um Sie. Privatunterricht wird halbtags-, ganztags- oder stundenweise angeboten.
Privat Ski
Ob alleine, mit Freunden oder Familie – Ihr Skilehrer kann sich ganz individuell um Sie kümmern. Privatunterricht ist jederzeit möglich, sowohl halbtags-, ganztags- od. stundenweise. Bitte vereinbaren Sie mit unserem Büro einen Termin.
Menüs
Menüs können ebenfalls einfach nachgebaut werden. Das Menü oben sieht zum Beispiel im Typo3 Backend so aus:
Die einzelnen Container Elemente werden mit den jeweiligen Klassen versehen. Dadurch wird um den gesamten Inhalt dieses <div> Element gelegt.
In diese Container können Typo3 Elemente gelegt werden:
Im Menü oben wird die Sprachenauswahl von Typo3 verwendet.
Zusätzlich wird die Navigation mit einer Auswahl an Seiten innerhalb von Typo3 realisiert.
Das pages Element ist weiter konfigurierbar unter Appearance.
Layout 1: Die Elemente sind linksbündig
Layout 2: Die Elemente sind rechtsbündig
Default: keine Formatierung der Elemente
Durch das Einfügen von blankem HTML, kann auch eigener Seiteninhalt erstellt werden.
WS Page Menu
Mit diesem Element kann ein einfaches Menü erstellt werden. Damit kann man einen Ordner auswählen, in dem die Seiten liegen, die angezeigt werden sollen.
Unter Appearance kann ein Layout gewählt werden.
Default: keine Formatierung
Bootstrap: Standard Formatierung von Bootstrap
WS Breadcrumb Menu
Dieses Element zeigt einfache Breadcrumbs
Weitere Einstellungen im Container Element
Plugin Options
Ein Container ohne weitere Einstellungen in den Plugin Options nimmt die gesamte Breite des übergeordneten Elements ein. Es ist keine Höhe vordefiniert. Jeder dieser Container hat die Klasse "ws-wrap".
Diesem Container kann eine Custom Class mitgegeben werden. Die anderen Klassen die vergeben werden können (fullwidth class, Container Class) wirken sich erst aus, wenn die jeweilige Option aktiv ist.
Option Full Width
Wenn diese Option aktiv ist, wird um den Container mit der Klasse "ws-wrap ( + Custom Class)" ein Container mit der Klasse "ws-fullwidth" gelegt. Dieser Container nimmt die gesamte Seitenbreite ein.
Mit der Einstellung fullwidth class, kann auch diesem Container eine eigene Klasse mitgegeben werden.
Option Container
Wenn diese Option aktiv ist, wird um den Container mit der Klasse "ws-wrap ( + Custom Class)" ein Container mit der Klasse "container" gelegt. Dieser Container entspricht dem Bootstrap Standard.
Mit der Einstellung Container Class, kann auch diesem Container eine eigene Klasse mitgegeben werden.
Wenn beide Optionen aktiv sind, wird der Container mit der Klasse "fullwidth" um den Container mitder Klasse "container" und um den Container mit der Klasse "ws-wrap" gelegt
Mehrspaltige Grid Elemente
Zusätzlich zum Container können auch mehrspaltige Grid Elemente im Backend definiert werden. Diese Elemente entsprechen dem Bootstrap Standard.
In den Plugin Options lassen sich die Breitenverhältnisse für die jeweiligen Spalten und Gerätegrößen einstellen. Unter custom classes können eigene Klassen für jede Spalte und Klassen für die übergeordnete row definiert werden.
Standard Elemente und Klassen
Bei einer Standardinstallation, werden einige Seiten und Elemente erstellt und Klassen vordefiniert. Um eine Seite wird immer ein <div> Element mit der Klasse "ws-basic" oder "ws-landing" gelegt (kann in den Seiteneinstellungen unter Appearance angepasst werden).
Im Pagetree unter resources werden die Seiten header, footer und widgets erstellt.
header
Die Seite unterteilt sich in die Bereiche Header und Top-Area. Diese Bereiche werden auf der Seite dann jeweils in einen Container mit der Klasse "ws-header" und "ws-toparea" gerendert.
footer
Die Seite unterteilt sich in die Bereiche Sub-Feature und Main. Diese Bereiche werden auf der Seite dann jeweils in einen Container mit der Klasse "ws-bottomarea" und "ws-footer" gerendert.
Alle anderen Content-Seiten sind unterteilt in die Bereiche Sub-Feature und Main. Diese Bereiche werden auf der Seite dann jeweils in einen Container mit der Klasse "feature-content" und "main-content" gerendert. Diese Container nehmnen die gesamte Breite des Bildschirms ein und rendern um den eingefügten Inhalt immer einen Bootstrap Container.
Nach diesen Elementen wird die Seite widgets gerendert. Darin Enhaltene Elemente können zum Beispiel als mitlaufende Widgets rechts oder links definiert und formatiert werden. Ein Beispiel ist der Back to top Button rechts unten.
Accordion
Das Accordion ist ein eigenes Grid Element für Typo3. Dieses erlaubt beispielsweise das Einfügen von viel Inhalt, der durch Überschriften geteilt ist. Diese Überschriften sind klickbar, und der Inhalt klappt darunter aus.
Alle Elemente, die in diesem Accordeon Element liegen, werden als eigene Überschrift gezählt. Diese Überschrift holt sich Typo3 aus dem Titel des Elements. Hierbei klappt immer nur das aktuelle Accordion aus
Erstes Element des Akkordeon
Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Nulla quis lorem ut libero malesuada feugiat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Pellentesque in ipsum id orci porta dapibus. Sed porttitor lectus nibh. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Zweites Element des Akkordeon
Drittes Element des Akkordeon
Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Nulla quis lorem ut libero malesuada feugiat. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Curabitur non nulla sit amet nisl tempus convallis quis ac lectus. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Pellentesque in ipsum id orci porta dapibus. Sed porttitor lectus nibh. Vivamus magna justo, lacinia eget consectetur sed, convallis at tellus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
