web-dev-qa-db-fra.com

Supprimer l'extension html des pages GitHub

J'utilise des pages GitHub pour héberger mon dernier site ( http://jasonhoffmann.github.io/ ). Je me demandais s'il y avait un moyen de supprimer l'extension .html de la fin des sous-pages ( http://jasonhoffmann.github.io/contact.html ) car il n'y a pas d'accès au serveur.

githubgithub-pages
34
Jason Hoffmann

Je suppose que vous devrez utiliser des sous-répertoires (mais il peut y avoir un moyen plus simple):

/index.html            => http://jasonhoffmann.github.io
/contact/index.html    => http://jasonhoffmann.github.io/contact

Cependant, vous pouvez avoir plus de contrôle en utilisant CNAME pour rediriger la page GitHub vers votre propre domaine . Désolé, je n'ai pas de réponse définitive pour vous, mais j'espère que cela peut vous aider à démarrer.

14
Sam

Cela fonctionne déjà et vous n'avez rien à faire

Je ne sais pas si vous en êtes déjà conscient ou non, mais pour supprimer l'extension .html des pages GitHub, tout ce que vous avez à faire est de supprimer l'extension .html de vos liens.

En d'autres termes, cela fonctionne déjà et vous n'avez rien à faire. Vous n'êtes pas obligé d'utiliser des sous-répertoires, CNAME, des redirections, Jekyll _config.yml, YAML front-matière ou tout autre hack suggéré dans toutes les réponses ici.

Exemples

Par exemple, vous pouvez utiliser:

au lieu de:

et il affiche le même fichier. Changez simplement les liens dans vos liens et c'est tout.

Des tests

J'ai fait quelques tests pour montrer comment cela fonctionne vraiment lorsque vous pouvez cliquer sur des liens et il met en évidence quel fichier est chargé avec quelle URL, y compris des avertissements sur les redirections non sécurisées dans certains cas.

Par exemple, le lien:

indique qu'il est affiché par le test1 dans l'URL mais affiche en fait le fichier test1.html: enter image description here

Problèmes avec d'autres solutions

Utiliser des éléments comme index.html dans des sous-répertoires spéciaux comme suggéré ici dans d'autres réponses ne fera pas ce que vous voulez, qui sert simplement le example.com/name.html à la demande de example.com/name, mais vous donnerait plutôt une redirection 301 vers example.com/name/ (notez la barre oblique finale) qui à son tour vous donnerait le contenu de example.com/name/index.html fichier.

Cela conduit aux problèmes suivants: vous êtes dans un répertoire différent et vous devez utiliser <a href="../name"> au lieu de seulement <a href="name"> pour les liens vers d'autres pages du même niveau et il en va de même pour tous les actifs (ou vous pouvez utiliser des chemins absolus comme quelqu'un l'a suggéré, ce qui n'est pas une bonne idée sur les pages GitHub - en particulier les pages de projet - car après les forks et les projets renommés, vous avez à ne pas oublier de mettre à jour tous les liens et les ressources js/css dans tous les fichiers html).

L'autre chose est que maintenant vous avez une redirection inutile pour chaque navigation - qui redirige incidemment de HTTPS vers HTTP ( des URL sécurisées sans barre oblique aux URL non sécurisées avec une barre oblique), par exemple voir:

qui (au moment de la rédaction) redirige vers:

et [~ # ~] et non [~ # ~] à:

comme vous pouvez vous y attendre, assurez-vous donc que vous en êtes conscient. Voir: Insecure redirect (Notez que cette image est liée à une URL HTTPS sécurisée mais que vous vous retrouvez avec une connexion HTTP non sécurisée - vous devrez peut-être utiliser le mode navigation privée pour voir que .)

Voici à quoi ressemblent les en-têtes, au 17 juin 2016:

$ curl -I https://rsp.github.io/gh-pages-no-extension/dir
HTTP/1.1 301 Moved Permanently
Server: GitHub.com
Content-Type: text/html
Location: http://rsp.github.io/gh-pages-no-extension/dir/
...       ^^^^

Espérons que GitHub résoudra ce problème à l'avenir. (Je l'ai découvert quand j'écrivais cette réponse il y a presque un an et ce problème est toujours présent en juin 2016.)

Bien que curieusement, à partir du 17 juin 2016 (je ne sais pas si cela a toujours été le cas car je l'ai remarqué récemment lors de la mise à jour de cette réponse) cette URL:

redirige vers:

comme il se doit. Voir les en-têtes:

$ curl -I https://rsp.github.io/gh-pages-no-extension
HTTP/1.1 301 Moved Permanently
Server: GitHub.com
Content-Type: text/html
Location: https://rsp.github.io/gh-pages-no-extension/
...       ^^^^^

La seule différence est qu'il s'agit d'une URL racine du projet et non d'un répertoire plus profond à l'intérieur du projet (voir la structure du projet ) donc la redirection boguée semble être présente uniquement dans les liens profonds à l'intérieur des pages GitHub d'un projet et sur un navigateur que j'ai testé uniquement lorsque vous utilisez le mode navigation privée.

L'essentiel est que vous devez faire attention . Mon conseil serait de éviter complètement toutes les redirections et de n'utiliser que les URL qui n'entraînent aucune redirection.

92
rsp

Vous pouvez le faire via Jekyll, un générateur de site statique intégré aux pages GitHub. Il a quelques paramètres de permalien qui peuvent être définis dans le _config.yml (qui affectera toutes les pages et tous les articles de votre site) ou dans le front-matière YAML pour chaque page/article.

Par exemple, vous pouvez ajouter le code suivant à votre contact.html fichier:

---
permalink: contact/
---

Cela serait inséré avant <!DOCTYPE html>, mais Jekyll prendra soin de le supprimer lorsqu'il est diffusé sur les pages GitHub. Lorsque vous faites cela, vous pourrez accéder à la page à l'adresse jasonhoffman.github.io/contact au lieu de jasonhoffman.github.io/contact.html. Ce que Jekyll fait en fait, c'est créer un répertoire appelé contact et mettre un index.html fichier à l'intérieur avec votre contact.html contenu. Si vous installez et exécutez Jekyll localement , voici ce que vous verrez:

.
|- _config.yml (optional)
|- contact.html
|- index.html
|- css
   |- styles.css
|- img
   |- image.jpg
|- _site
   |- index.html
   |- contact
      |- index.html
   |- css
      |- styles.css
   |- img
      |- image.jpg

Si vous n'installez pas Jekyll localement, vous verrez tout cela, moins le _site dossier. Lorsque vous le transmettez à GitHub, leurs serveurs exécutent Jekyll et génèrent et servent l'équivalent d'un _site pour vous (mais il ne sera pas visible dans votre référentiel GitHub).

Vous pouvez également ignorer Jekyll et créer un sous-répertoire contact avec un index.html à l'intérieur. Dans tous les cas, vous devrez également vous assurer que tous les liens vers des éléments (img, css, js) de votre site comportent un /. Par exemple,

<link rel="stylesheet" href="css/style.css">

Devrait plutôt être

<link rel="stylesheet" href="/css/style.css">
7
nicksuch

J'utilise le thème du renard arctique , qui tilise les chaînes de lien suivantes :

<a class="page-link" href="{{ page.url | prepend: site.baseurl }}">{{ page.title }}</a>

La solution consiste à ajouter remove: '.html' comme filtre, ce qui entraîne

<a class="page-link" href="{{ page.url | remove: '.html' | prepend: site.baseurl }}">{{ page.title }}</a>

Service local avec Jekyll ne fonctionne pas actuellement, mais est promis pour Jekyll 3.0: https://github.com/jekyll/jekyll/pull/3452

4
koppor

Pour l'instant, il vous suffit d'ajouter permalink: /your-pretty-url

L'autre réponse ne fonctionne pas. J'ai essayé. Vous devez ajouter le préfixe "/".

Par exemple:

---
layout: post
title:  "Welcome to Jekyll!"
date:   2017-04-29 22:04:31 +0700
categories: jekyll update
permalink: /welcome
---
4
Rizky Syaiful

Suppression de l'extension .html en remplaçant le lien permanent par

permalink: /:title/

N'oubliez pas le dernier /

3
muTheTechie

Comme l'utilisateur rsp a mentionné que de jolis permaliens sont déjà implémentés par GitHub Pages et que l'on n'a rien à faire, cela ne sera pas fait lors de l'exécution du serveur Jekyll localement ou dans Jekyll par défaut. Si vous souhaitez supprimer l'extension html des pages en utilisant Jekyll dans votre propre site non Github Pages (toujours servi avec Jekyll) ou si vous avez un site de développement local qui est autant que possible similaire à Github Pages avant de pousser vers GitHub,

Il vous suffit d'ajouter ceci a_config.ymlfichier:

permalink: pretty

Cela supprime le .html du lien en faisant en sorte que tous les messages aient leur propre dossier et les messages nommés index.html.

3
matrixanomaly