Was ist TORNADO?

TORNADO ist ein Contao-Theme für Sanitär, Heizung und Klima – in der Demo für einen Heizungs- und Sanitärbetrieb mit Notdienst, Leistungen, Referenzen und Kundenstimmen. Das Theme setzt Contao 5.7 voraus und basiert auf denselben Werkzeugen wie LASR 5, SOLO 4 und SIRIUS 3:

• Theme-Bundle mit Twig-Templates: Die Templates des Themes liegen als Twig im erdmannfreunde/tornado-theme-bundle, das alle weiteren Erweiterungen über Composer mitbringt. Anpassungen erfolgen über das Template Studio.

• Theme-Dateien im layout/-Verzeichnis: Die schreibgeschützte Originalversion liegt unter layout/tornado-theme/, deine eigenen Anpassungen verwaltet die Theme Toolbox unter layout/custom/.

• Theme Toolbox 4.5 mit dem Theme Editor im Backend und dem Live-Editor im Frontend. Für den Live-Editor bringt TORNADO drei Vorlagen mit: Kobalt, Schiefer und Marmor.

• Nutshell Framework 2.x als Basis sowie die Element-Bundles Hero, Card und Kontakt, die Grid-Erweiterung, die Onepage-Navigation, das Portfolio-Bundle für Referenzen und Swiper Pro für die Kundenstimmen.

Multi-Page, One-Page und Styleguide

Die Demo enthält drei Startpunkte mit je einem eigenen Seitenlayout:

Startpunkt	Adresse	Seitenlayout	Inhalt
TORNADO	/	Standard	Multi-Page-Variante mit Hauptnavigation und Untermenüs
TORNADO One-Page	/one-page/	One-Page	One-Page-Variante: alle Inhalte auf einer Seite, die Onepage-Navigation springt zu den Abschnitten
Styleguide	/styleguide/	Styleguide	Jeder Baustein für sich, mit den passenden CSS-Klassen

Die Multi-Page-Variante (Seitenlayout Standard) ist der Standard. Die One-Page-Variante ist eine gleichwertige zweite Einrichtung im selben Theme. Beide sind eigenständig: Jede Variante hat eigene Seiten, Module und ein eigenes Referenzen-Archiv. Du kannst also die Variante, die du nicht brauchst, einfach löschen. Wie das geht, steht in der Anleitung TORNADO Theme mit Demo installieren.

Der Styleguide zeigt jedes Element, jeden Baustein und jede Layout-Variante von TORNADO und nennt dazu die Klassen, die du im Klassen-Manager auswählst. Behalte ihn in deinem Projekt, er hilft dir und deinen Redakteur:innen beim Aufbau neuer Seiten. Bevor die Website online geht, schützt du ihn oder setzt ihn auf unveröffentlicht.

Barrierearm

TORNADO ist auf Tastaturbedienung, Screenreader und ausreichende Kontraste ausgelegt. Die Vorlagen des Live-Editors sind auf Kontrast geprüft. Bei eigenen Farben warnt der Live-Editor, wenn ein Kontrast nicht reicht. Die Navigation, die Dialoge für Referenzen und Nachrichten und die Ajax-Formulare setzen den Fokus so, dass Tastatur und Screenreader folgen können. Wer im System „Bewegung reduzieren“ eingestellt hat, bekommt kein weiches Scrollen und keine Seitenübergänge, und ein Hintergrundvideo im Hero startet erst per Klick.

Ob eine Website barrierefrei ist, entscheidet sich erst mit ihren Inhalten: Bilder brauchen Alternativtexte, Farben genug Kontrast. TORNADO legt dafür die Grundlage. Deshalb nennen wir es barrierearm.

Wie geht es weiter?

Neuen Theme-Nutzer:innen empfehlen wir, das Theme mit Demo zu installieren. Danach erfährst du in der Anleitung TORNADO Theme individualisieren, wie du Farben, Schriften und Logo an dein Projekt anpasst.