Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Jekyll

Paramétrer Jekyll pour Github Pages en 60 secondes

by
Read Time:3 minsLanguages:
This post is part of a series called 60 Second Video Tutorials.
Start Learning Web Design in 60 Seconds
Adobe XD in 60 Seconds

French (Français) translation by Syméon Smith (you can also view the original English article)

Jekyll peut être utilisé avec GitHub Pages pour créer de simples sites web statiques comme des blogs. Cette vidéo vous montre comment mettre en place la base de la structure des fichiers de Jekyll en 60 secondes !

Lorsque vous êtes paramétré et en manque d'inspiration, allez voir ce qu'il y a de disponible dans les thèmes pour Jekyll sur Envato Market.

Si vous préférez une explication écrite, voici tout le processus décrit en étapes simples :

Nouveau projet

D'abord, créez un dossier dans votre système pour un nouveau repo. Faites cela en utilisant le terminal pour naviguer là où vous voulez que votre nouveau dossier soit, puis en entrant mkdir mysite. Notre nouveau dossier est appelé "mysite" mais vous pouvez l'appeler comme vous voulez.

Changez de location pour ce nouveau dossier en entrant cd mysite – une fois que vous y êtes, créez un fichier de configuration en entrant la commande vim _config.yml. Votre terminal va vous montrer le contenu de ce fichier, donc tapez i pour entrer en mode d'insertion, et ajoutez le contenu suivant :

Appuyez sur Echap pour quitter le mode d'insertion, et entrez :x pour sauvegarder les modifications que vous avez faites.

Créer l'index

Ensuite on doit créer le document d'index, donc entrez vim index.md et comme vous l'avez fait précédemment ajoutez le contenu suivant :

Ajouter le dossier d'agencement

Maintenant créez un nouveau dossier en entrant mkdir _layouts et allez dans ce dossier avec cd _layouts. Ajoutez un document de template par défaut (vim default.html) et ajoutez le contenu suivant :

Initialiser le nouveau repo

Maintenant on doit initialiser le dossier comme un nouveau repo et faire un commit des changements. Donc commencez par naviguer à la racine du projet avec cd ... Entrez ensuite git init, suivi de git add --all && git commit --all.

Envoyer à GitHub

Allez sur GitHub dans votre navigateur et créez un nouveau repo.

Vous allez avoir différentes options ici, alors regardez les commandes où vous voyez push an existing repository from the command line. Les commandes seront à peu près :

Collez ces commandes dans le terminal pour envoyer votre repo local à GitHub.

Paramètres de Github

Pour finir, dans les Paramètres du repo GitHub, choisissez d'utiliser la branche master pour GitHub Pages, et Sauvegardez.

Jekyll est paramétré, et votre site est prêt à être créé !

La structure des fichiers de Jekyll, explication

  • _config.yml est le fichier de configuration de Jekyll. C'est ce que GitHub Pages lit pour les paramètres globaux du site comme des variables globales etc.
  • index.md est le document d'index à la racine de GitHub Pages.
  • _layouts/default.html est le template par défaut sur lequel index.md sera basé.

Ressources utiles

Pour plus d'informations sur la création de sites statiques avec Jekyll, regardez les ressources suivantes sur Envato Tuts+ !


Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.