Création d’un site GitHub Pages avec Jekyll

Vous pouvez utiliser Jekyll pour créer un site GitHub Pages dans un dépôt nouveau ou existant.

Qui peut utiliser cette fonctionnalité ?

People with admin permissions for a repository can create a GitHub Pages site with Jekyll.

GitHub Pages est disponible dans les référentiels publics avec GitHub Free et GitHub Free pour les organisations, et dans les référentiels publics et privés avec GitHub Pro, GitHub Team, GitHub Enterprise Cloud et GitHub Enterprise Server.

Platform navigation

Dans cet article

Remarque : Les propriétaires de l’organisation peuvent restreindre la publication de sites GitHub Pages des dépôts appartenant à l’organisation. Pour plus d’informations, consultez « Gestion de la publication de sites GitHub Pages pour votre organisation ».

Prérequis

Avant de pouvoir utiliser Jekyll pour créer un site GitHub Pages, vous devez installer Jekyll et Git. Pour plus d’informations, consultez Installation dans la documentation de Jekyll et « Configurer Git ».

Nous vous recommandons d’utiliser Bundler pour installer et exécuter Jekyll. Bundler gère les dépendances de gemme Ruby, réduit les erreurs de build Jekyll et empêche les bogues liés à l’environnement. Pour installer Bundler :

  1. Installer Ruby Pour plus d’informations, consultez « Installation de Ruby » dans la documentation de Ruby.
  2. Installez Bundler. Pour plus d’informations, consultez « Bundler ».

Conseil : Si vous voyez une erreur Ruby lorsque vous essayez d’installer Jekyll à l’aide de Bundler, vous devrez peut-être utiliser un gestionnaire de package, tel que RVM ou Homebrew, pour gérer votre installation Ruby. Pour plus d’informations, consultez « Résolution des problèmes » dans la documentation de Jekyll.

Création d’un dépôt pour votre site

Vous pouvez créer un dépôt ou choisir un dépôt existant pour votre site.

Si vous souhaitez créer un site GitHub Pages pour un dépôt où les fichiers du dépôt ne sont tous pas liés au site, vous pouvez configurer une source de publication pour votre site. Par exemple, vous pouvez avoir une branche et un dossier dédiés pour conserver les fichiers sources de votre site, ou vous pouvez utiliser un workflow GitHub Actions personnalisé pour générer et déployer les fichiers sources de votre site. Pour utiliser GitHub Actions en tant que source de publication de GitHub Pages, un administrateur de site doit activer GitHub Actions pour GitHub Enterprise Server. Pour plus d’informations, consultez « Activation de GitHub Actions pour GitHub Enterprise Server ».

Si vous souhaitez créer un site dans un dépôt existant, passez à la section « Création de votre site ».

  1. Dans le coin supérieur droit de n’importe quelle page, sélectionnez sur , puis cliquez sur Nouveau référentiel.

    Capture d’écran d’un menu déroulant GitHub montrant les options permettant de créer des éléments. L’élément de menu « Nouveau référentiel » est souligné en orange foncé.

  2. Utilisez le menu déroulant Propriétaire pour sélectionner le compte auquel vous voulez donner la propriété du dépôt.

    Capture d’écran du menu propriétaire d’un nouveau dépôt GitHub. Le menu montre deux options, octocat et github.

  3. Tapez un nom pour votre référentiel et une description facultative. Si vous créez un utilisateur ou un site d’organisation, votre référentiel doit être nommé <user>.github.io ou <organization>.github.io. Si votre nom d’utilisateur ou d’organisation contient des lettres majuscules, vous devez mettre les lettres en minuscules. Pour plus d’informations, consultez « À propos de GitHub Pages ».

    Capture d’écran des paramètres GitHub Pages dans un dépôt. Le champ nom du dépôt contient le texte « octocat.github.io » et est délimité en orange foncé.

  4. Choisissez une visibilité de dépôt. Pour plus d’informations, consultez « À propos des dépôts ».

Création de votre site

Pour pouvoir créer votre site, vous devez avoir un dépôt pour votre site sur GitHub Enterprise Server. Si vous ne créez pas votre site dans un dépôt existant, consultez « Création d’un dépôt pour votre site ».

Avertissement : si votre administrateur de site a activé les pages publiques, les sites GitHub Pages sont disponibles publiquement sur Internet, même si leur dépôt est privé ou interne. Si vous avez des données sensibles dans le dépôt de votre site, vous pouvez les supprimer avant publication. Pour plus d’informations, consultez « Configuration de GitHub Pages pour votre entreprise » et « À propos des dépôts ».

  1. Ouvrez TerminalTerminalGit Bash.

  2. Si vous n’avez pas encore de copie locale de votre dépôt, accédez à l’emplacement où vous souhaitez stocker les fichiers sources de votre site, en remplaçant PARENT-FOLDER par le dossier qui contiendra le dossier pour votre dépôt.

    cd PARENT-FOLDER

  3. Si vous ne l’avez pas déjà fait, initialisez un dépôt Git local, en remplaçant REPOSITORY-NAME par le nom de votre dépôt.

    $ git init REPOSITORY-NAME
> Initialized empty Git repository in /REPOSITORY-NAME/.git/
# Creates a new folder on your computer, initialized as a Git repository

  4. Changez de répertoire dans le dépôt.

    $ cd REPOSITORY-NAME
# Changes the working directory

  5. Déterminez la source de publication que vous souhaitez utiliser. Pour plus d’informations, consultez « Configuration d’une source de publication pour votre site GitHub Pages ».

  6. Accédez à la source de publication pour votre site. Pour plus d’informations, consultez « Configuration d’une source de publication pour votre site GitHub Pages ». Par exemple, si vous avez choisi de publier votre site à partir du dossier docs de la branche par défaut, créez et changez de répertoire dans le dossier docs.

    $ mkdir docs
# Creates a new folder called docs
$ cd docs

    If you chose to publish your site from the gh-pages branch, create and checkout the gh-pages branch.

    $ git checkout --orphan gh-pages
# Creates a new branch, with no history or contents, called gh-pages, and switches to the gh-pages branch
$ git rm -rf .
# Removes the contents from your default branch from the working directory

  7. Pour créer un site Jekyll, utilisez la commande jekyll new :

    $ jekyll new --skip-bundle .
# Creates a Jekyll site in the current directory

  8. Ouvrez le Gemfile créé par Jekyll.

  9. Ajoutez « # » au début de la ligne qui commence par gem "jekyll" pour commenter cette ligne.

  10. Ajoutez la gemme github-pages en modifiant la ligne commençant par # gem "github-pages". Remplacez cette ligne par :

    gem "github-pages", "~> GITHUB-PAGES-VERSION", group: :jekyll_plugins

    Remplacez GITHUB-PAGES-VERSION par la dernière version prise en charge de la gemme github-pages. Vous trouverez cette version ici : « Versions de dépendances ».

    La bonne version de Jekyll est installée en tant que dépendance de la gemme github-pages.

  11. Enregistrez et fermez le Gemfile.

  12. À partir de la ligne de commande, exécutez bundle install.

  13. Ouvrez le fichier .gitignore que Jekyll a créé et ignorez le fichier gems lock en ajoutant cette ligne :

    Gemfile.lock

  14. Si vous le souhaitez, apportez toutes les modifications nécessaires au fichier _config.yml. C’est nécessaire pour les chemins relatifs lorsque le dépôt est hébergé dans un sous-répertoire. Pour plus d’informations, consultez « Fractionnement d’un sous-dossier en un nouveau dépôt ».

    domain: my-site.github.io       # if you want to force HTTPS, specify the domain without the http at the start, e.g. example.com
url: https://my-site.github.io  # the base hostname and protocol for your site, e.g. http://example.com
baseurl: /REPOSITORY-NAME/      # place folder name if the site is served in a subfolder

  15. Si vous le souhaitez, testez votre site localement. Pour plus d’informations, consultez « Test de votre site GitHub Pages localement avec Jekyll ».

  16. Ajoutez et commitez votre travail.

    git add .
git commit -m 'Initial GitHub pages site with Jekyll'

  17. Ajoutez votre dépôt dans votre instance GitHub Enterprise Server en tant que dépôt distant, en remplaçant HOSTNAME par le nom d'hôte de votre entreprise, USER par le compte propriétaire du dépôt, et REPOSITORY par le nom du dépôt.

    
$ git remote add origin https://HOSTNAME/USER/REPOSITORY.git

  18. Envoyez le dépôt à GitHub Enterprise Server, en remplaçant BRANCH par le nom de la branche sur laquelle vous travaillez.

    git push -u origin BRANCH

  19. Configurez votre source de publication. Pour plus d’informations, consultez « Configuration d’une source de publication pour votre site GitHub Pages ».

  20. Dans GitHub Enterprise Server, accédez au dépôt de votre site.

  21. Sous le nom de votre dépôt, cliquez sur Paramètres. Si vous ne voyez pas l’onglet « Paramètres », sélectionnez le menu déroulant , puis cliquez sur Paramètres.

    Capture d’écran d’un en-tête de dépôt montrant les onglets. L’onglet « Paramètres » est mis en évidence avec un encadré orange foncé.

  22. Dans la section « Code et automatisation » de la barre latérale, cliquez sur Pages.

  23. Pour voir votre site publié, sous « GitHub Pages », cliquez sur Visiter le site.

    Capture d’écran d’un message de confirmation pour GitHub Pages répertoriant l’URL du site. À droite de l’URL, un bouton intitulé « Visiter le site » est délimité en orange foncé.

    Remarque : La publication des changements de votre site peut prendre jusqu’à 10 minutes après les avoir poussés vers GitHub Enterprise Server. Si vous ne voyez pas vos modifications du site GitHub Pages reflétées dans votre navigateur après une heure, consultez « À propos des erreurs de build Jekyll pour les sites GitHub Pages ».

Remarques:

  • Si vous publiez à partir d’une branche et votre site n’a pas été publié automatiquement, assurez-vous qu’une personne avec des autorisations d’administrateur et une adresse e-mail vérifiée a effectué une poussée vers la source de publication.

  • Les commits envoyés par un workflow GitHub Actions qui utilise le GITHUB_TOKEN ne déclenchent pas de build GitHub Pages.

Étapes suivantes

Pour ajouter une nouvelle page ou publier sur votre site, consultez « Ajout d’un thème à votre site GitHub Pages avec Jekyll ».

Vous pouvez ajouter un thème Jekyll à votre site GitHub Pages pour personnaliser son apparence. Pour plus d’informations, consultez « Ajout d’un thème à votre site GitHub Pages avec Jekyll ».