Informationen zu GitHub Pages und Jekyll

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 unter Jekyll.

Jekyll wird von Windows nicht offiziell unterstützt. Weitere Informationen findest du in der Jekyll-Dokumentation unter Jekyll unter Windows.

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 finden Sie unter Informationen zu GitHub Pages.

Jekyll in der GitHub Pages-Website konfigurieren

Die meisten Jekyll-Einstellungen, z. B. das Design und die Plug-Ins Ihrer Site, können Sie durch Bearbeitung der Datei _config.yml konfigurieren. Weitere Informationen findest du in der Jekyll-Dokumentation unter Konfiguration.

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 namens /node_modules oder /vendor.
• Sie beginnen mit _, . oder #.
• Sie enden mit ~.
• Sie werden durch die Einstellung exclude in der Konfigurationsdatei ausgeschlossen.

Wenn du möchtest, dass Jekyll solche Dateien verarbeitet, kannst du dies mit der include-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 in der Jekyll-Dokumentation unter Front Matter.

Du kannst site.github einem Beitrag oder einer Seite hinzufügen, um deiner Website Metadaten für Repositoryreferenzen hinzuzufügen. Weitere Informationen findest du in der Dokumentation zu Jekyll-Metadaten unter Nutzen von site.github.

Teilziele

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

Du kannst deiner Website auf GitHub ein unterstütztes Design hinzufügen. Weitere Informationen findest du unter Unterstützte Designs auf der GitHub Pages-Website und unter Hinzufügen eines Designs zu deiner GitHub Pages-Website mithilfe von Jekyll.

Zum Verwenden eines beliebigen anderen auf GitHub gehosteten Open Source-Designs von Jekyll kannst du dieses manuell hinzufügen. Weitere Informationen findest du unter Auf GitHub gehostete Designs und Ein Design zur GitHub Pages-Website mit Jekyll hinzufügen.

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 in der Jekyll-Dokumentation unter Außerkraftsetzen der Standardeinstellungen deines Designs.

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 kannst du beispielsweise GitHub-Emojis auf allen Seiten deiner Website genauso verwenden wie auf GitHub. Weitere Informationen findest du in der Jekyll-Dokumentation unter Plug-Ins.

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

• jekyll-coffeescript
• jekyll-default-layout
• jekyll-gist
• jekyll-github-metadata
• jekyll-optional-front-matter
• jekyll-paginate
• jekyll-readme-index
• jekyll-titles-from-headings
• jekyll-relative-links

Sie können zusätzliche Plug-Ins aktivieren, indem Sie das Gem des Plug-Ins der Einstellung plugins in der Datei _config.yml hinzufügen. Weitere Informationen findest du in der Jekyll-Dokumentation unter Konfiguration.

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

GitHub Pages kann keine Websites mit nicht unterstützten Plug-ins erstellen. Wenn du nicht unterstützte Plug-ins verwenden möchtest, musst du deine Website lokal erstellen und die statischen Dateien der Website anschließend zu GitHub pushen.

Syntaxhervorhebung

Damit deine Website leichter lesbar ist, werden Codeausschnitte auf GitHub Pages-Websites ebenso markiert wie auf GitHub. Weitere Informationen zur Syntaxhervorhebung in GitHub findest du unter Code-Blöcke erstellen und markieren.

Standardmäßig werden Codeblöcke auf deiner Website von Jekyll markiert. Jekyll verwendet den Rouge-Marker, der mit Pygments kompatibel ist. Wenn Sie Pygments in der Datei _config.yml angeben, wird stattdessen Rouge als Fallback verwendet. Jekyll kann keinen anderen Syntaxmarker verwenden. Wenn Sie einen anderen Syntaxmarker in der Datei _config.yml angeben, wird eine Buildwarnung für die Seite angezeigt. Weitere Informationen finden Sie unter Informationen zu Jekyll-Build-Fehler für GitHub Pages-Websites.

Wenn Sie einen anderen Marker, wie zum Beispiel highlight.js verwenden möchten, müssen Sie die Jekyll-Syntaxhervorhebung deaktivieren, indem Sie die Datei _config.yml des Projekts aktualisieren.

kramdown:
  syntax_highlighter_opts:
    disable : true

Wenn dein Design kein CSS für Syntaxhervorhebung enthält, kannst du GitHub-Syntaxhervorhebungs-CSS generieren und der style.css-Datei des Projekts hinzufügen.

rougify style github > style.css

Website lokal erstellen

Falls die Veröffentlichung über einen Branch erfolgt, werden Änderungen an deiner Website automatisch veröffentlicht, wenn sie in der Veröffentlichungsquelle deiner Website zusammengeführt werden. Falls die Veröffentlichung über einen benutzerdefinierten GitHub Actions-Workflow erfolgt, werden Änderungen bei jeder Auslösung des Workflows veröffentlicht (normalerweise durch einen Push an den Standardbranch). Wenn du zuerst eine Vorschau deiner Änderungen sehen möchtest, kannst du die Änderungen lokal vornehmen statt auf GitHub. Dann teste deine Website lokal. Weitere Informationen findest du unter GitHub Pages-Website lokal mit Jekyll testen.