Informationen zu GitHub Pages und Jekyll

Jekyll ist ein Generator für statische Websites mit integrierter Unterstützung von GitHub Pages.

GitHub Pages is available in internal and private repositories with GitHub AE. GitHub Pages is available in public repositories with GitHub Free and GitHub Free for organizations, and in public and private repositories with GitHub Pro, GitHub Team, GitHub Enterprise Cloud, and GitHub Enterprise Server.

Informationen zu Jekyll

Jekyll ist ein Generator für statische Websites mit integrierter Unterstützung von GitHub Pages und einem vereinfachten Build-Prozess. Jekyll erstellt aus Markdown- und HTML-Dateien eine statische Website und nutzt dabei die von Dir ausgewählten Layouts. Jekyll unterstützt Markdown und Liquid, eine Vorlagensprache, die dynamische Inhalte auf Deiner Website lädt. Weitere Informationen findest Du auf der Website zu Jekyll.

Jekyll wird von Windows nicht offiziell unterstützt. For more information, see "Jekyll on Windows" in the Jekyll documentation.

Wir empfehlen, Jekyll mit GitHub Pages zu verwenden. Wenn Du möchtest, kannst Du aber auch andere Generatoren für statische Websites verwenden oder Deinen eigenen Build-Prozess lokal oder auf einem anderen Server anpassen. Weitere Informationen findest Du unter „Informationen zu GitHub Pages.“

Jekyll in der GitHub Pages-Website konfigurieren

Du kannst die meisten Jekyll-Einstellungen konfigurieren, beispielsweise das Design und die Plug-ins Deiner Website, indem Du die Datei _config.yml bearbeitest. Weitere Informationen findest Du unter „Konfiguration“ in der Jekyll-Dokumentation.

Einige Konfigurationseinstellungen können für GitHub Pages-Websites nicht geändert werden.

lsi: false
safe: true
source: [your repo's top level directory]
incremental: false
highlighter: rouge
gist:
  noscript: false
kramdown:
  math_engine: mathjax
  syntax_highlighter: rouge

Standardmäßig erstellt Jekyll keine Dateien und Ordner, auf die Folgendes zutrifft:

  • sie befinden sich in einem Ordner mit dem Namen /node_modules oder /vendor
  • start with _, ., or #
  • sie enden mit ~
  • sie werden von der exclude-Einstellung in der Konfigurationsdatei ausgeschlossen

Wenn Du möchtest, dass Jekyll solche Dateien verarbeitet, kannst Du dies mit der includes-Einstellung in der Konfigurationsdatei festlegen.

Frontmatter

Um Variablen und Metadaten wie Titel und Layout für eine Seite oder einen Beitrag auf Deiner Seite zu setzen, kannst Du YAML-Titelei zuoberst in jeder Markdown- oder HTML-Datei hinzufügen. Weitere Informationen findest Du unter „Titelei" in der Jekyll Dokumentation.

Du kannst site.github zu einem Beitrag oder einer Seite hinzufügen, um Repository-Referenz-Metadaten zu Deiner Website hinzuzufügen. Weitere Informationen findest Du unter „site.github verwenden“ in der Jekyll-Metadaten-Dokumentation.

Designs

Du kannst zu Deiner GitHub Pages-Website ein Jekyll-Design hinzufügen, um das Erscheinungsbild Deiner Website anzupassen. Weitere Informationen findest Du unter „Themes“ (Designs) in der Jekyll-Dokumentation.

You can add a theme to your site manually. For more information, see "Supported themes" on the GitHub Pages site and "Adding a theme to your GitHub Pages site using Jekyll."

Du kannst alle Standardeinstellungen Deines Designs überschreiben, indem Du die Dateien des Designs bearbeitest. Weitere Informationen findest Du in der Dokumentation zu Deinem Design und unter „Overriding your theme's defaults“ (Standardeinstellungen Deines Designs überschreiben) in der Jekyll-Dokumentation.

Plug-ins

Du kannst Jekyll-Plug-ins herunterladen oder erstellen, um die Funktionalität von Jekyll für Deine Website zu erweitern. Mit dem Plugin jemoji können Sie beispielsweise GitHub-Emojis auf allen Seiten Ihrer Website genauso verwenden wie auf GitHub. Weitere Informationen findest Du unter „Plugins“ (Plug-ins) in der Jekyll-Dokumentation.

GitHub Pages verwendet Plug-ins, die standardmäßig aktiviert sind und nicht deaktiviert werden können:

Du kannst zusätzliche Plug-ins aktivieren, indem Du die Gem des Plug-ins zur plugins-Einstellung in der Datei _config.yml hinzufügst. Weitere Informationen findest Du unter „Konfiguration“ in der Jekyll-Dokumentation.

Eine Liste der unterstützten Plug-ins findest Du unter „Abhängigkeitsversionen auf der GitHub Pages-Website. Informationen zur Verwendung eines bestimmten Plug-ins findest Du in der dazugehörigen Dokumentation.

Tipp: Um sicherzustellen, dass Sie die aktuellen Versionen aller Plug-ins verwenden, sollten Sie die GitHub Pages-Gem regelmäßig aktualisieren. Weitere Informationen findest Du unter „GitHub Pages-Website lokal mit Jekyll testen“ und „Abhängigkeitsversionen“ auf der GitHub Pages-Website.

GitHub Pages kann keine Websites mit nicht unterstützten Plug-ins erstellen. Wenn Sie nicht unterstützte Plug-ins verwenden möchten, müssen Sie Ihre Website lokal erstellen und die statischen Dateien der Website anschließend zu GitHub AE pushen.

Syntaxmarkierung

Damit Ihre Website leichter lesbar ist, werden Code-Ausschnitte auf GitHub Pages-Websites ebenso markiert wie auf GitHub AE. Weitere Informationen zur Syntaxmarkierung auf GitHub AE findest Du unter „Codeblöcke erstellen und markieren.“

Standardmäßig werden Codeblöcke auf Deiner Website von Jekyll markiert. Jekyll verwendet den Markierer Rouge, der mit Pygments kompatibel ist. Wenn Du in Deiner _config.yml-Datei Pygments spezifizierst, wird stattdessen Rouge verwendet. Jekyll kann keinen anderen Syntaxmarkierer verwenden. Wenn Du einen anderen Syntaxmarkierer in der _config.yml-Datei angibst, wird eine Build-Warnung für die Website angezeigt. Weitere Informationen findest Du unter „Informationen zu Jekyll-Build-Fehler für GitHub Pages-Websites.“

Wenn Du einen anderen Markierer verwenden möchtest, z. B. highlight.js, musst Du die Jekyll-Syntaxmarkierung deaktivieren, indem Du die _config.yml-Datei Deines Projekts änderst.

kramdown:
  syntax_highlighter_opts:
    disable : true

Wenn Ihr Design kein CSS für die Syntaxmarkierung enthält, können Sie das CSS von GitHub zur Syntaxmarkierung erzeugen und zur Datei style.css des Projekts hinzufügen.

$ rougify style github > style.css

Website lokal erstellen

Änderungen an Deiner Website werden automatisch veröffentlicht, wenn die Änderungen in der Veröffentlichungsquelle Deiner Website zusammengeführt werden. Wenn Du zuerst eine Vorschau Ihrer Änderungen sehen möchtest, kannst Du die Änderungen lokal vornehmen statt auf GitHub AE. Dann teste Deine Website lokal. Weitere Informationen findest Du unter „Deine GitHub Pages-Website lokal mit Jekyll testen.“

Did this doc help you?Privacy policy

Help us make these docs great!

All GitHub docs are open source. See something that's wrong or unclear? Submit a pull request.

Make a contribution

Oder, learn how to contribute.