Un modèle jekyll sobre et sans tracas pour les entreprises.
Vous pouvez prévisualiser le thème ici
Responsive : prise en charge immédiate de toutes les tailles d'écran, qu'il s'agisse de smartphones, d'ordinateurs portables, de tablettes...
Multilingue : gérez facilement les pages, le menu, l'url, les dates, le plan du site en plusieurs langues
Personnalisable : les couleurs du thème, le menu et les éléments sociaux peuvent être modifiés à partir d'un fichier de configuration central
De nombreux widgets : onglets, mini-posts, projecteurs, listes de fonctionnalités et bien plus encore peuvent être facilement insérés sans se soucier de leurs composants internes.
De nombreux modèles : formulaires de contact, menus de navigation et autres peuvent être facilement insérés grâce aux inclusions personnalisées de Jekyll
Images vectorielles : les images du thème sont vectorisées, s'affichent de manière fluide sur n'importe quel écran et peuvent être stylisées de manière dynamique
Prêt pour le RGPD : fourni avec un plugin de consentement aux cookies et une politique de confidentialité standard conforme au RGPD
Prêt pour le référencement : le plan du site, les robots.txt et les balises sont automatiquement générés pour le site Web
Light : images svg, pouces et chargement paresseux pour les images raster, peu de bibliothèques
Performant : chargement et exécution parallèles des actifs, prise en charge du chargement paresseux, actifs minifiés, chemin critique compressé
Renforcé : validation de formulaire, recaptcha, bibliothèques vérifiées
Ajoutez cette ligne au Gemfile
de votre site Jekyll :
gem "jekyll-theme-consulting"
Et ajoutez cette ligne au _config.yml
de votre site Jekyll :
theme : jekyll-theme-consulting
Et puis exécutez :
$ bundle
Ou installez-le vous-même en tant que :
$ gem install jekyll-theme-consulting
Pour ceux qui ne connaissent pas le fonctionnement de Jekyll, consultez jekyllrb.com pour tous les détails, ou renseignez-vous uniquement sur les bases de la présentation, de la rédaction d'articles et de la création de pages.
Copiez le fichier _config.yml
du référentiel de thèmes à la racine de l'arborescence des dossiers de votre site Web. La section suivante explique l'impact des paramètres et comment configurer correctement _config.yml
.
Vous pouvez utiliser les paramètres personnalisés suivants dans _config.yml
.
title
et subtitle
sont affichés côte à côte :
Des icônes sociales apparaîtront pour chaque URL que vous indiquez, parmi facebook_url
, etc.
Vos coordonnées peuvent être utilisées dans les formulaires de contact, dans le pied de page ou ailleurs.
Le formulaire de contact est validé à l'aide du plugin recaptcha de Google. Tout d’abord, vous devez [inscrire votre site Web] pour activer le plugin. Google vous fournira une clé d'intégration côté client : copiez-la dans _config.yml
sous recaptcha.sitekey
.
Le téléchargement et le rendu des images peuvent être différés jusqu'à ce qu'elles entrent dans la fenêtre. Cela raccourcit le chargement de la page web, sans conséquence sur le contenu affiché puisque les images sont hors écran.
Il y a 2 possibilités :
La prise en charge du chargement différé par les navigateurs varie, il est donc recommandé d'opter pour la première solution.
class="lazy-loading"
src
avec le chemin d'accès au fichier d'espace réservédata-src
avec le chemin d'accès au fichier de contenuAvant:
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Après:
< img class =" lazy-loading " src =" {{ 'assets/images/placeholder.jpg' | absolute_url }} " data-src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
loading="lazy"
Avant:
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Après:
< img loading =" lazy " src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Cette fonctionnalité n'est pas supportée par tous les navigateurs !
Il est recommandé d'utiliser le format webp
.
À une dimension et un niveau de compression (qualité) donnés, les fichiers webp font au moins la moitié de leur taille avec une sensation plus fluide.
Dans le référentiel de votre propre site Web, modifiez le fichier _config.yml
:
url : " https://<github-account-name>.github.io/<repository-name> "
Construisez le site Web avec :
$ JEKYLL_ENV=production bundle exec jekyll build
Confiez tout votre travail à la branche actuelle.
Créez une branche nommée gh-pages
:
$ git checkout -b gh-pages
Et enfin remplacez le contenu du référentiel par les pages Web générées :
$ mkdir ~/backup
$ mv ./* ~/backup/
$ mv ~/backup/.git ./
$ mv ~/backup/_site/* ./
$ git add .
$ git commit -m "First draft"
Le contenu du référentiel est sauvegardé dans le répertoire personnel de l'utilisateur.
Et enfin pousser vers github
$ git push --u origin gh-pages
Dans le répertoire de votre propre site Web, modifiez le fichier _config.yml
:
url : " https:<domain-name> "
Construisez le site Web avec :
$ JEKYLL_ENV=production bundle exec jekyll build
Copiez le contenu du dossier _site
sur votre serveur, probablement dans www
.
Si nécessaire, configurez votre serveur pour servir ce répertoire.
Les rapports de bogues et les demandes d'extraction sont les bienvenus sur GitHub à l'adresse https://github.com/apehex/jekyll-theme-consulting. Ce projet est destiné à être un espace de collaboration sûr et accueillant, et les contributeurs doivent adhérer au code de conduite Contributor Covenant.
Pour configurer votre environnement pour développer ce thème, exécutez bundle install
.
Pour tester le thème, exécutez bundle exec jekyll serve
et ouvrez votre navigateur à http://localhost:4000
. Cela démarre un serveur Jekyll utilisant le thème. Ajoutez des pages, des documents, des données, etc. comme d'habitude pour tester le contenu du thème. Au fur et à mesure que vous apportez des modifications au thème et à votre contenu, votre site se régénérera et vous devriez voir les modifications dans le navigateur après une actualisation, comme d'habitude.
Lorsque le thème sera publié, seuls les fichiers _layouts
, _includes
, _sass
et assets
suivis avec Git seront regroupés. Pour ajouter un répertoire personnalisé au theme-gem, veuillez modifier l'expression rationnelle dans jekyll-theme-consulting.gemspec
en conséquence.
Inspiré du travail de @ajlkn.
Utilise le modèle de base du plugin de consentement aux cookies.
Utilise le simple plugin de recherche Jekyll.
Image spatiale dans la bannière : les piliers de la création, gracieuseté de la NASA.
Le thème est disponible en open source sous les termes CC-BY-NC-SA-4.0.