Doku > Installation eines Hugo-Themes

Anleitung zur Installation eines Hugo-Theme ohne Git

Wenn Sie das HugoCMS installiert haben, können Sie eine Hugo Theme auch ohne direkten Zugriff auf die Kommandozeile oder Git installieren. Hier ist, wie Sie vorgehen können:

Schritt 1: Theme herunterladen

  1. Wählen Sie eine Theme aus: Besuchen Sie das Hugo Themes Verzeichnis und suchen Sie eine Theme, die Ihren Anforderungen entspricht.
  2. Theme herunterladen: Viele Themes bieten Download-Links oder .zip-Dateien direkt auf ihrer Projektseite an. Laden Sie die .zip-Datei Ihrer gewählten Theme auf Ihren lokalen Computer herunter.

Schritt 2: Datei auf den Server hochladen

  1. Dateimanger öffnen: Melden Sie sich an Ihrem HugoCMS an und aktivieren Sie den Admin-Mode über den Button mit der Beschriftungen Admin Modus, oder klicken Sie zweimal auf den Button mit der Beschriftung Normaler Modus.
  2. Zum themes-Verzeichnis navigieren: Innerhalb des Dateimanagers navigieren Sie zum themes-Ordner Ihrer Hugo-Installation. Dieser befindet sich in der Regel im Wurzelverzeichnis Ihrers Arbeitsverzeichnisses auf Ihrem Webserver bzw. Webhostings.
  3. Hochladen der Theme-Datei: Nutzen Sie die Upload-Funktion des Dateimanagers, um die .zip-Datei Ihrer Theme hochzuladen, die Sie zuvor auf Ihren Computer heruntergeladen haben.

Schritt 3: Theme entpacken

  1. .zip-Datei lokalisieren: Finden Sie die hochgeladene .zip-Datei in dem Dateimanager.
  2. Datei entpacken: Rechtsklicken Sie auf die .zip-Datei und wählen Sie die Option zum Entpacken (z.B. „Extract Here“ oder „Hier entpacken“). Dies wird die Theme-Dateien in einen neuen Ordner innerhalb des themes-Verzeichnisses extrahieren.

Schritt 4: Theme in Hugo aktivieren

Um die neue Theme zu aktivieren, müssen Sie die Konfigurationsdatei Ihrer Hugo-Website aktualisieren. Da Sie den Dateimanger verwenden, können Sie die Konfigurationsdatei (config.toml, config.yaml oder config.json) direkt im Webbrowser bearbeiten.

  1. Konfigurationsdatei öffnen: Navigieren Sie zur Konfigurationsdatei Ihrer Hugo-Website und öffnen Sie sie zur Bearbeitung.

  2. Theme ändern: Ändern Sie den Wert der theme-Einstellung, um den Namen des Ordners der neuen Theme anzugeben, den Sie gerade entpackt haben. Speichern Sie die Änderungen.

    Beispiel für config.json:

    "theme": "Name-des-Themes",
    
  3. Änderungen überprüfen: Um die Änderungen zu überprüfen, müssen Sie die Webseite Veröffentliche, über den Button mit der selben Beschriftung und auf Ihre Website gehen und sicherstellen, dass das neue Theme korrekt angewendet wurde.

Fertig!

Sie haben erfolgreich eine neue Hugo Theme mithilfe von HugoCMS installiert und aktiviert. Dieser Prozess ermöglicht eine einfache Verwaltung Ihrer Website-Dateien direkt über einen Webbrowser, was besonders nützlich ist, wenn Sie mit Git nicht vertraut sind.


Falls Sie während des Prozesses auf Probleme stoßen, überprüfen Sie auch die Dokumentation des Theme oder die offizielle Hugo-Dokumentation für weitere Hilfe.