Wie du ein Theme ohne Demo installierst - Entwickler Edition

Einrichtung der lokalen Entwicklungsumgebung (einmalig)

Wenn du das erste Mal mit gulp oder anderen Taskrunnern arbeitest, musst du noch node.js, den Node Package Manager - npm und gulp global installieren. Global bedeutet, dass es Projektübergreifend zur Verfügung steht.

1. Auf der nodejs-Website kannst du node.js herunterladen und installieren (der Node Package Manager ist bereits enthalten). Weitere Informationen und ein kurzes Video bekommst du hier.
2. Öffne das Terminal / die Kommandozeile. Führe den Befehl npm install gulp-cli -g aus. Solltest du mehrere Fehlermeldungen bekommen, verwende sudo npm install gulp-cli -g. Die Option -g sorgt dafür, dass gulp.js global installiert wird.

1. Contao-Installation

Installiere Contao in deiner lokalen Entwicklungsumgebung über Composer oder den Contao Manager.

Mittels Composer:

php composer.phar create-project contao/managed-edition . 4.8

Mittels Contao Manager:
Lade dir den Contao Manager von der Contao Website herunter und folge den Anweisungen: Zur Contao Website

2. Erweiterungen installieren

Installiere das jeweilige Theme-Bundle, zum Beispiel

php composer.phar require erdmannfreunde/lasr-theme-bundle

Das Theme Bundle wird alle benötigten Erweiterungen in der richtigen Version herunterladen und installieren.

3. Theme importieren

Logge dich im Contao Backend ein und gehe zum Menüpunkt Layout » Themes. Dort klickst du auf Importieren und wählst die CTO-Datei aus dem Theme-Download aus:

Nach dem Import ist das Theme inkl. Seitenlayout und Frontend-Module bereit für die Verwendung. Wenn du Komponenten wie News und Events verwendest, musst du, nachdem du die Archive angelegt hast, diese noch in den Frontend-Modulen auswählen.

4. gulp einrichten

1. Kopiere folgende Dateien aus dem Theme-Paket in dein Contao Hauptverzeichnis:
   • .browserslistrc
   • .editorconfig
   • gulpfile.js
   • package.json

   Die Dateien werden für die Installation und Verwendung von gulp.js benötigt.

2. Öffne die Kommandozeile. Gehe in dein Contao Hauptverzeichnis und führe den Befehl npm install aus. Dadurch wird gulp.js und die dazugehörigen Plugins installiert.
3. Öffne die gulpfile.js und stelle unter var bsProxy die URL zu deiner lokalen Installation ein, z.B. “localhost” oder “solo.localhost”
4. Öffne die Kommandozeile erneut. Gehe in dein Contao Hauptverzeichnis und starte gulp mit dem Befehl gulp. Gulp sollte nun die Produktionsdateien (CSS, JS) erstellen. Über localhost:3000 kannst du nun das Frontend aufrufen.