Kevin Papst PHP Freelancer aus Berlin

Redirects mit Jekyll und nginx

R

Wahrscheinlich jeder der schonmal eine Jekyll Seite aufgesetzt hat oder eine Wordpress Seite nach Jekyll migriert hat kennt die Fragestellung:

Wie baue ich Redirects mit Jekyll?

Die Lösung des Problems hängt davon ab, wo man die Jekyll Seite hosten will:

  1. GitHub Pages
  2. Selber gehostet

Jekyll Redirects auf GitHub Pages

Die Lösung ist simpel – aber zumindest aus SEO Sicht unschön: fügt Eurer _config.yml einfach unter dem Punkt gems bzw. plugins (je nachdem welche Jekyll Version gerade aktuell ist) das Jekyll Plugin „jekyll-redirect-from“ hinzu:

gems:
  - jekyll-redirect-from

Desweiteren müsst Ihr in jeder Page/Post Datei das Liquid Frontmatter anpassen und unterhalb des Keys redirect_from die umzuleitenden URLs hinterlegen:

---
layout: post
title: Redirects with Jekyll
description: How to create redirects with Jekyll
permalink: /jekyll-redirects/
redirect_from:
  - /my-old-url.html
---

Wenn dies nun auf GithubPages deployed wird, dann erstellt Jekyll automatisch für jeden redirect_from Eintrag eine html Datei, die via <meta refresh> die Seite umleitet. Das ist zwar nicht schön, aber die einzige Lösung die momentan auf GitHub lauffähig ist.

Jekyll Redirects mit nginx

Um echte Server Redirects zu verwenden muss man eine Verbindung schaffen zwischen einer statischen generierten Seite und der nginx Serverkonfiguration.

Es gibt verschiedene Jekyll Plugins für diesen Mechanismus, z.B. jekyll-server-redirects, allerdings sind mir diese Lösungen viel zu aufwändig. Denn wenn wir wirklich nur Redirects wollen und sowieso die Kontrolle über den Server haben, dann können wir die Redirects auch einfach als eine Jekyll Seite betrachten und beim Build erzeugen lassen.

Die Idee ist maximale Kompatibilität mit der bestehenden redirect_from Lösung, so dass eine Migration zwischen GithubPages und eigenem Hosting ermöglicht wird. Das Frontmatter bleibt also genauso wie beim letzten Abschnitt, wir legen aber zusätzlich eine .htaccess Datei im Repo ab die wie folgt aussieht:

---
---
{%- for page in site.pages %}
 {%- if page.redirect_from != nil %}
  {%- for redirect in page.redirect_from %}
rewrite ^{{ redirect }}$ {% if page.permalink == nil %}{{ page.url }}{% else %}{{ page.permalink }}{% endif %} permanent;
  {%- endfor %}
 {%- endif %}
{%- endfor %}
{%- for post in site.posts %}
 {%- if post.redirect_from != nil %}
  {%- for redirect in post.redirect_from %}
rewrite ^{{ redirect }}$ {{ post.url }} permanent;
  {%- endfor %}
 {%- endif %}
{%- endfor %}

Diese Datei wird dank der Frontmatter Tags durch Jekyll geparsed und kann somit auch alle Seiten Configs verarbeiten. Hier laden wir also einfach alle Pages & Posts und erzeugen nginx kompatible Redirects in der Datei .htaccess. Solltet ihr eigenen Collections verwenden, dann fügt für diese einfach weitere foreach Schleifen hinzu.

Diese Datei müsst Ihr natürlich noch in Eurer nginx Server Konfiguration laden:

server {
listen 80;
server_name www.jekyllsite.com;
root /var/www/www.jekyllsite.com/_site;
include /var/www/www.jekyllsite.com/_site/.htaccess;
[...]
}

Bitte beachtet, das nginx aus Performance Gründen diese Datei natürlich nicht pro Request neu lädt. Ihr müsst also zumindest ein service nginx reload nach einem Re-Build Eurer Jekyll Seite durchführen!

Jekyll Redirects mit Apache

Das Prinzip ist dasselbe wie bei nginx. Allerdings ist die Syntax hierbei eine andere, die .htaccess muss also an die Apache spezifische Syntax angepasst werden.

Da ich schon seit Jahren keinen Apache mehr aufgesetzt habe, bitte einfach mal googlen. Sollte AllowOverwrite All für das Verzeichnis an sein, dann wird die .htaccess Automatisch geladen.

Was sonst noch?

Eigene Redirects könnt Ihr einfach als weitere Zeilen in die .htaccess eintragen.

Kevin Papst PHP Freelancer aus Berlin

Rubriken

Stichwörter

Get in touch