Générer des urls cleans avec Jekyll

26 Juillet 2013

Par défaut le système de permalink de Jekyll est puissant mais pose problème lorsque l’on vient de WordPress, qui lui propose des URLs cleans. En migrant mon blog j’ai tout fait pour conserver ce système de permalinks, mais jusqu’à aujourd’hui je devais «hacker» Jekyll pour obtenir le résultat souhaité via un fork. C’est d’ailleurs surprenant que Jekyll ne propose pas des URLs cleans par défaut…

Pour des raisons techniques (je souhaiterai utiliser rbenv plutôt que rvm), je souhaiterai me passer du fork et utiliser la version officielle. La solution est vraiment très simple, elle n’est pas esthétique mais elle a l’avantage de ne pas prendre de temps à mettre en oeuvre.

Mise à jour des templates HTML

Il faut configurer Jekyll afin qu’il génére des fichiers HTML avec le permalien de votre chois et ensuite pour chaque fichier qui génère une liste de liens, il va falloir manuellement supprimer l’extension .html des liens générés, c’est tellement simple que je m’en veux de ne pas y avoir pensé plus tôt.

On commence donc par éditer le fichier de configuration _config.yml pour bien générer des permaliens avec l’extension html :

permalinks: /articles/:title.html

Ensuite à chaque endroit ou vous faites une liste de posts, il va falloir un peu modifier le code qui insert l’url de vos posts en supprimant l’extension .html. Heureusement le système de templating Liquid dispose d’un filter permettant cela.

Il faut donc remplacer vos appels :

{ { post.url } }

par :

{ { post.url | remove:'.html' } }

Attention, il y a des espaces entre les accolades

Bon maintenant, Jekyll génère les fichiers comme on le souhaite, il faut configurer notre serveur pour qu’il «trouve» le fichier sans l’extension.

Configuration Apache/Nginx

Apache

Pour Apache, la configuration est très simple grâce à la directive MultiViews. Il y a juste à ajouter cette directive dans les Options de votre VHost, ce qui donnera pas exemple :

<VirtualHost *:80>
   [...]
   <Directory "/var/www/www.site.com/">
      Options MultiViews
      [...]
   </Directory>
</VirtualHost>

On recharge la configuration et tout doit refonctionner comme avant avec de belles URLs, Apache affichera la bonne page que l’URL contienne l’extension ou pas !

Nginx

Pour nginx, malheureusement je ne connais pas d’équivalent à la directive MultiViews d’Apache, mais on peut se débrouiller autrement. Dans la config de votre server, il suffit d’ajouter deux petits tests tel que :

server {
   [...]
   # Do nothing if URI has .html extension
   if ($request_filename ~* ^.+.html$) {
      break;
   }
   
   # add .html to URI and serve file, directory, or symlink if it exists
   if (-e $request_filename.html) {
      rewrite ^/(.*)$ /$1.html last;
      break;
   }
}

On recharge également la conf et c’est tout, les URLs avec ou sans l’extension s’affichent.

Conclusion

J’ai fait l’opération de mise à jour de mes templates à la main sur mes deux blogs (je n’avais que 5 occurences à remplacer), mais vous pouvez faire un gros «search & replace» dans toute votre arborescence pour remplacer l’ancienne valeur par la valeur modifiée ça doit marcher sans trop de soucis.

Jekyll met un peu plus de temps à générer le site à cause de l’opération de suppression de l’extension mais ce n’est pas trop grave pour moi tant que cela reste sous la barre des 10 secondes.

Et surtout, je n’ai plus besoin du fork que j’ai créé, je peux utiliser la version officielle à jour de Jekyll pour générer mes sites.

Charger les commentaires…