ai folio
1.0.0
Un thème Jekyll simple, propre et réactif pour les universitaires. Si vous aimez le thème, donnez-lui une étoile !
Vous voulez en savoir plus sur Jekyll ? Consultez ce tutoriel. Pourquoi Jekyll ? Lisez le billet de blog d'Andrej Karpathy !
Pour une présentation pratique de l'installation d'al-folio, regardez ce didacticiel vidéo sympa réalisé par l'un des membres de la communauté ! ? ?
La meilleure façon d'utiliser ce modèle est de cliquer sur Utiliser ce modèle au-dessus de la liste des fichiers. Ensuite, créez un nouveau référentiel sur github.com:<your-username>/<your-repo-name> . Si vous envisagez de télécharger votre site sur <your-github-username>.github.io , notez que le nom de votre référentiel doit être <your-github-username>.github.io ou <your-github-orgname>.github.io , comme indiqué dans la documentation des pages GitHub. Pour plus d'informations sur la façon de déployer votre site, consultez la section Déploiement ci-dessous. Après avoir créé votre nouveau référentiel, téléchargez-le simplement sur votre machine :
$ git clone [email protected]: < your-username > / < your-repo-name > .git
$ cd < your-repo-name > Utiliser Docker pour installer les dépendances Jekyll et Ruby est le moyen le plus simple.
Vous devez suivre les étapes suivantes pour que al-folio soit opérationnel sur votre ordinateur local :
$ docker compose pull
$ docker compose upNotez que lorsque vous l'exécutez pour la première fois, il téléchargera une image Docker d'environ 400 Mo.
Maintenant, n'hésitez pas à personnaliser le thème comme bon vous semble (n'oubliez pas de changer le nom !). Une fois que vous avez terminé, vous pouvez utiliser la même commande ( docker compose up ) pour afficher la page Web avec toutes vos modifications. Assurez-vous également de valider vos modifications finales.
Pour changer le numéro de port, vous pouvez modifier le fichier
docker-compose.yml.
Remarque : cette approche n'est nécessaire que si vous souhaitez créer une version plus ancienne ou très personnalisée d'al-folio.
Créez et exécutez une nouvelle image Docker en utilisant :
$ docker compose up --buildSi vous souhaitez mettre à jour jekyll, installer de nouveaux packages Ruby, etc., tout ce que vous avez à faire est de reconstruire l'image en utilisant l'argument
--force-recreateà la fin de la commande précédente ! Il téléchargera Ruby et Jekyll et réinstallera tous les packages Ruby à partir de zéro.
Si vous souhaitez utiliser une version spécifique de Docker, vous pouvez le faire en remplaçant latest balise par your_version dans docker-compose.yaml . Par exemple, vous avez peut-être créé votre site Web sur v0.10.0 et vous souhaitez vous y tenir.
En supposant que Ruby et Bundler soient installés sur votre système ( indice : pour faciliter la gestion des gemmes Ruby, pensez à utiliser rbenv ), ainsi que Python et pip ( indice : pour faciliter la gestion des packages Python, envisagez d'utiliser un environnement virtuel, comme venv ou conda . Si vous utilisez uniquement jupyter , vous pouvez utiliser pipx ).
$ bundle install
# assuming pip is your Python package manager
$ pip install jupyter
$ bundle exec jekyll serve --lsiMaintenant, n'hésitez pas à personnaliser le thème comme bon vous semble (n'oubliez pas de changer le nom !). Une fois que vous avez terminé, validez vos dernières modifications.
Le déploiement de votre site Web sur les pages GitHub est l'option la plus populaire. À partir de la version v0.3.5, al-folio redéployera automatiquement votre page Web chaque fois que vous apporterez de nouvelles modifications à votre référentiel !
Pour les pages Web personnelles et d’organisation :
<your-github-username>.github.io ou <your-github-orgname>.github.io ._config.yml , définissez url sur https://<your-github-username>.github.io et laissez baseurl vide.<your-github-username>.github.io .Pour les pages du projet :
_config.yml , définissez url sur https://<your-github-username>.github.io et baseurl sur /<your-repository-name>/ .<your-github-username>.github.io/<your-repository-name>/ .Pour activer le déploiement automatique :
master , votre référentiel devrait maintenant avoir une branche gh-pages nouvellement construite.gh-pages ( PAS sur master ). Pour plus de détails, consultez Configuration d'une source de publication pour votre site GitHub Pages. Si vous conservez votre site sur une autre branche, ouvrez .github/workflows/deploy.yml sur la branche sur laquelle vous conservez votre site Web et modifiez on->push->branches et on->pull_request->branches vers la branche sur laquelle vous conservez votre site Web. sur. Cela déclenchera l’action sur les pulls/pushs sur cette branche. L'action déploiera ensuite le site Web sur la branche à partir de laquelle elle a été déclenchée.
Si vous devez redéployer manuellement votre site Web sur les pages GitHub, accédez à Actions, cliquez sur « Déployer » dans la barre latérale gauche, puis sur « Exécuter le workflow ».
Si vous décidez de ne pas utiliser les pages GitHub et d'héberger votre page ailleurs, exécutez simplement :
$ bundle exec jekyll build --lsi qui (re-)générera la page Web statique dans le dossier _site/ . Copiez ensuite simplement le contenu du répertoire _site/ sur votre serveur d'hébergement.
Si vous souhaitez également supprimer les classes CSS inutilisées de votre fichier, exécutez :
$ purgecss -c purgecss.config.js qui remplacera les fichiers CSS dans le dossier _site/assets/css/ par les fichiers CSS purgés.
Remarque : Assurez-vous de définir correctement les champs url et baseurl dans _config.yml avant de créer la page Web. Si vous déployez votre page Web sur your-domain.com/your-project/ , vous devez définir url: your-domain.com et baseurl: /your-project/ . Si vous déployez directement sur your-domain.com , laissez baseurl vide.
Remarque : n'essayez pas d'utiliser cette méthode à moins de savoir ce que vous faites (assurez-vous de bien connaître les sources de publication). Cette approche permet d'avoir le code source du site Web dans un référentiel et la version de déploiement dans un référentiel différent.
Supposons que la source de publication de votre site Web soit un sous publishing-source d'un référentiel version git cloné sous $HOME/repo/ . Pour un site utilisateur, cela pourrait bien être quelque chose comme $HOME/<user>.github.io .
Tout d’abord, à partir du répertoire du dépôt de déploiement, consultez la branche git hébergeant votre source de publication.
Ensuite, à partir du répertoire des sources du site Web (généralement le clone de votre fork al-folio) :
$ bundle exec jekyll build --lsi --destination $HOME /repo/publishing-source Cela demandera à jekyll de déployer le site Web sous $HOME/repo/publishing-source .
Remarque : Jekyll nettoiera $HOME/repo/publishing-source avant de construire !
La citation ci-dessous est tirée directement de la documentation de configuration de jekyll :
Les dossiers de destination sont nettoyés sur les versions du site
Le contenu de
<destination>est automatiquement nettoyé, par défaut, lors de la création du site. Les fichiers ou dossiers qui ne sont pas créés par votre site seront supprimés. Certains fichiers peuvent être conservés en les spécifiant dans la directive de configuration<keep_files>.N'utilisez pas un emplacement important pour
<destination>; utilisez-le plutôt comme zone de transit et copiez les fichiers de là sur votre serveur Web.
Si $HOME/repo/publishing-source contient des fichiers que vous souhaitez que jekyll laisse intacts, spécifiez-les sous keep_files dans _config.yml . Dans sa configuration par défaut, al-folio copiera le README.md de niveau supérieur dans la source de publication. Si vous souhaitez modifier ce comportement, ajoutez README.md sous exclude dans _config.yml .
Remarque : n'exécutez pas jekyll clean sur votre référentiel source de publication, car cela entraînerait la suppression de l'intégralité du répertoire, quel que soit le contenu de keep_files dans _config.yml .
Si vous avez installé al-folio comme décrit ci-dessus, vous pouvez configurer une action GitHub pour synchroniser automatiquement votre référentiel avec la dernière version du thème.
Accédez à Paramètres -> Actions -> Général -> Autorisations de flux de travail, accordez des autorisations de lecture et d'écriture aux actions GitHub, cochez « Autoriser les actions GitHub à créer et approuver des demandes d'extraction » et enregistrez vos modifications.
Ensuite, allez dans Actions -> Nouveau workflow -> configurez vous-même un workflow, configurez le workflow suivant et validez vos modifications :
name : Sync from template
on :
# cronjob trigger
schedule :
- cron : " 0 0 1 * * "
# manual trigger
workflow_dispatch :
jobs :
repo-sync :
runs-on : ubuntu-latest
steps :
# To use this repository's private action, you must check out the repository
- name : Checkout
uses : actions/checkout@v3
- name : actions-template-sync
uses : AndreasAugustin/[email protected]
with :
github_token : ${{ secrets.GITHUB_TOKEN }}
source_repo_path : alshedivat/al-folio
upstream_branch : masterVous recevrez une pull request dans votre référentiel si des modifications sont disponibles dans le modèle.
Une autre option consiste à mettre à jour manuellement votre code en suivant les étapes ci-dessous :
# Assuming the current directory is <your-repo-name>
$ git remote add upstream https://github.com/alshedivat/al-folio.git
$ git fetch upstream
$ git rebase v0.9.0 Si vous avez largement personnalisé une version précédente, la mise à niveau peut être plus difficile. Vous pouvez toujours suivre les étapes ci-dessus, mais git rebase peut entraîner des conflits de fusion qui doivent être résolus. Voir le manuel de git rebase et comment résoudre les conflits pour plus d'informations. Si le rebasage est trop compliqué, nous vous recommandons de réinstaller la nouvelle version du thème à partir de zéro et de porter manuellement votre contenu et les modifications de la version précédente.
Voici quelques questions fréquemment posées. Si vous avez une question différente, veuillez la poser en utilisant Discussions.
Q : Après avoir créé un nouveau référentiel à partir de ce modèle et configuré le référentiel, j'obtiens une erreur de déploiement. Le site Web n'est-il pas censé se déployer correctement et automatiquement ?
R : Oui, si vous utilisez la version v0.3.5 ou ultérieure, le site Web se redéployera automatiquement et correctement juste après votre première validation. Veuillez apporter quelques modifications (par exemple, modifier les informations de votre site Web dans _config.yml ), valider et pousser. Assurez-vous de suivre les instructions de déploiement de la section précédente. (Problème pertinent : 209.)
Q : J'utilise un domaine personnalisé (par exemple, foo.com ). Mon domaine personnalisé devient vide dans les paramètres du référentiel après chaque déploiement. Comment puis-je résoudre ce problème ?
R : Vous devez ajouter le fichier CNAME à la branche master ou source de votre référentiel. Le fichier doit contenir votre nom de domaine personnalisé. (Problème pertinent : 130.)
Q : Ma page Web fonctionne localement. Mais après le déploiement, la construction échoue et lance Unknown tag 'toc' . Comment puis-je résoudre ce problème ?
R : Assurez-vous d'avoir suivi les instructions de déploiement de la section précédente. Vous auriez dû définir la branche de déploiement sur gh-pages . (Problème connexe : 1438.)
Q : Ma page Web fonctionne localement. Mais après déploiement, il ne s'affiche pas correctement (CSS et JS ne sont pas chargés correctement). Comment puis-je résoudre ce problème ?
R : Assurez-vous de spécifier correctement les chemins url et baseurl dans _config.yml . Définissez url sur https://<your-github-username>.github.io ou sur https://<your.custom.domain> si vous utilisez un domaine personnalisé. Si vous déployez un site Web personnel ou organisationnel, laissez baseurl vide. Si vous déployez une page de projet, définissez baseurl: /<your-project-name>/ . Si toutes les étapes précédentes ont été effectuées correctement, il ne reste plus qu'à votre navigateur de récupérer la feuille de style du site.
Q : Le flux Atom ne fonctionne pas. Pourquoi?
R : Assurez-vous de spécifier correctement les chemins url et baseurl dans _config.yml . Le plugin RSS Feed fonctionne avec ces champs correctement configurés : title , url , description et author . Assurez-vous de les remplir de manière appropriée et réessayez.
Q : Mon site ne fonctionne pas lorsque j'active related_blog_posts . Pourquoi?
R : Cela est probablement dû au plugin de renaissance du classificateur, qui est utilisé pour calculer les publications associées. Si l'erreur indique Liquid Exception: Zero vectors can not be normalized... , cela signifie qu'il n'a pas pu calculer les publications associées pour une publication spécifique. Cela est généralement dû à des articles de blog vides ou minimes, sans mots significatifs (c'est-à-dire uniquement des mots vides) ni même à des caractères spécifiques que vous avez utilisés dans vos articles. De plus, le calcul des publications similaires est effectué pour chaque post , c'est-à-dire chaque page qui utilise layout: post , y compris les annonces. Pour modifier ce comportement, ajoutez simplement related_posts: false au début de la page sur laquelle vous ne souhaitez pas afficher les publications associées.
Q : Lors de la tentative de déploiement, il demande les informations de connexion à GitHub. GitHub a désactivé l'authentification par mot de passe et se termine avec une erreur. Comment réparer ?
R : Ouvrez le fichier .git/config à l’aide de votre éditeur préféré. Remplacez la partie https de la variable url par ssh . Essayez à nouveau de déployer.
La page de vos publications est générée automatiquement à partir de votre bibliographie BibTex. Modifiez simplement _bibliography/papers.bib . Vous pouvez également ajouter de nouveaux fichiers *.bib et personnaliser l'apparence de vos publications comme bon vous semble en éditant _pages/publications.md .
Dans les publications, l'entrée de l'auteur pour vous-même est identifiée par le tableau de chaînes scholar:last_name et le tableau de chaînes scholar:first_name dans _config.yml :
scholar :
last_name : [Einstein]
first_name : [Albert, A.] Si l'entrée correspond à une forme des noms et des prénoms, elle sera soulignée. Conservez les méta-informations sur vos co-auteurs dans _data/coauthors.yml et Jekyll insérera automatiquement des liens vers leurs pages Web. Le format des données du co-auteur dans _data/coauthors.yml est le suivant :
" Adams " :
- firstname : ["Edwin", "E.", "E. P.", "Edwin Plimpton"]
url : https://en.wikipedia.org/wiki/Edwin_Plimpton_Adams
" Podolsky " :
- firstname : ["Boris", "B.", "B. Y.", "Boris Yakovlevich"]
url : https://en.wikipedia.org/wiki/Boris_Podolsky
" Rosen " :
- firstname : ["Nathan", "N."]
url : https://en.wikipedia.org/wiki/Nathan_Rosen
" Bach " :
- firstname : ["Johann Sebastian", "J. S."]
url : https://en.wikipedia.org/wiki/Johann_Sebastian_Bach
- firstname : ["Carl Philipp Emanuel", "C. P. E."]
url : https://en.wikipedia.org/wiki/Carl_Philipp_Emanuel_BachSi l'entrée correspond à l'une des combinaisons de noms et de prénoms, elle sera mise en surbrillance et liée à l'url fournie.
Il existe plusieurs mots-clés Bibtex personnalisés que vous pouvez utiliser pour affecter la façon dont les entrées sont affichées sur la page Web :
abbr : Ajoute une abréviation à gauche de l'entrée. Vous pouvez ajouter des liens vers ceux-ci en créant un fichier venue.yaml dans le dossier _data et en ajoutant les entrées qui correspondent.abstract : ajoute un bouton "Abs" qui développe un champ de texte masqué lorsque vous cliquez dessus pour afficher le texte abstraitarxiv : Ajoute un lien vers le site Arxiv (Remarque : ajoutez uniquement l'identifiant arxiv ici - le lien est généré automatiquement)bibtex_show : Ajoute un bouton "Bib" qui développe un champ de texte masqué avec l'entrée bibliographique complètehtml : Insère un bouton "HTML" redirigeant vers le lien spécifié par l'utilisateurpdf : Ajoute un bouton "PDF" redirigeant vers un fichier spécifié (si aucun lien complet n'est spécifié, le fichier sera supposé être placé dans le répertoire /assets/pdf/)supp : Ajoute un bouton "Supp" à un fichier spécifié (si un lien complet n'est pas spécifié, le fichier sera supposé être placé dans le répertoire /assets/pdf/)blog : Ajoute un bouton "Blog" redirigeant vers le lien spécifiécode : Ajoute un bouton "Code" redirigeant vers le lien spécifiéposter : Ajoute un bouton "Poster" redirigeant vers un fichier spécifié (si aucun lien complet n'est spécifié, le fichier sera supposé être placé dans le répertoire /assets/pdf/)slides : Ajoute un bouton "Slides" redirigeant vers un fichier spécifié (si aucun lien complet n'est spécifié, le fichier sera supposé être placé dans le répertoire /assets/pdf/)website : Ajoute un bouton "Site Web" redirigeant vers le lien spécifiéaltmetric : ajoute un badge Altmetric (Remarque : si le DOI est fourni, utilisez simplement true , sinon ajoutez uniquement l'identifiant altmetric ici - le lien est généré automatiquement)dimensions : ajoute un badge Dimensions (Remarque : si DOI ou PMID est fourni, utilisez simplement true , sinon ajoutez uniquement l'identifiant des dimensions ici - le lien est généré automatiquement)Vous pouvez implémenter vos propres boutons en éditant le fichier bib.html.
Ce thème Jekyll implémente collections pour vous permettre de diviser votre travail en catégories. Le thème est livré avec deux collections par défaut : news et projects . Les éléments de la collection news sont automatiquement affichés sur la page d'accueil. Les éléments de la collection projects sont affichés sur une grille réactive sur la page des projets.
Vous pouvez facilement créer vos propres collections, applications, nouvelles, cours ou tout autre travail créatif. Pour ce faire, modifiez les collections dans le fichier _config.yml , créez un dossier correspondant et créez une page de destination pour votre collection, similaire à _pages/projects.md .
al-folio est livré avec des mises en page élégantes pour les pages et les articles de blog.
Le thème permet de créer des articles de blog dans le style distill.pub :
Pour plus de détails sur la façon de créer des publications de style distill à l'aide des balises <d-*> , veuillez vous référer à l'exemple.
al-folio prend en charge la composition mathématique rapide via MathJax et la coloration syntaxique du code à l'aide du style GitHub :
Le formatage des photos est simplifié grâce au système de grille de Bootstrap. Créez facilement de belles grilles dans vos articles de blog et vos pages de projet :
al-folio utilise github-readme-stats et github-profile-trophy pour afficher les référentiels GitHub et les statistiques des utilisateurs sur la page /repositories/ .
Modifiez le _data/repositories.yml et modifiez les listes github_users et github_repos pour inclure votre propre profil GitHub et vos référentiels dans la page /repositories/ .
Vous pouvez également utiliser les codes suivants pour l'afficher dans d'autres pages.
<!-- code for GitHub users -->
{% if site.data.repositories.github_users %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% for user in site.data.repositories.github_users %}
{% include repository/repo_user.html username=user %}
{% endfor %}
</ div >
{% endif %}
<!-- code for GitHub trophies -->
{% if site.repo_trophies.enabled %}
{% for user in site.data.repositories.github_users %}
{% if site.data.repositories.github_users.size > 1 %}
< h4 > {{ user }} </ h4 >
{% endif %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% include repository/repo_trophies.html username=user %}
</ div >
{% endfor %}
{% endif %}
<!-- code for GitHub repositories -->
{% if site.data.repositories.github_repos %}
< div class =" repositories d-flex flex-wrap flex-md-row flex-column justify-content-between align-items-center " >
{% for repo in site.data.repositories.github_repos %}
{% include repository/repo.html repository=repo %}
{% endfor %}
</ div >
{% endif %} Une variété de belles couleurs de thème ont été sélectionnées parmi lesquelles vous pouvez choisir. La valeur par défaut est violet, mais vous pouvez la modifier rapidement en modifiant la variable --global-theme-color dans le fichier _sass/_themes.scss . D'autres variables de couleur y sont également répertoriées. Les options de couleurs de thème de stock disponibles peuvent être trouvées sur _sass/_variables.scss . Vous pouvez également ajouter vos propres couleurs à ce fichier en attribuant à chacune un nom pour faciliter leur utilisation dans le modèle.
al-folio prend en charge les images d'aperçu sur les réseaux sociaux. Pour activer cette fonctionnalité, vous devrez définir serve_og_meta sur true dans votre _config.yml . Une fois que vous l'avez fait, toutes les pages de votre site incluront des données Open Graph dans l'élément d'en-tête HTML.
Vous devrez ensuite configurer quelle image afficher dans les aperçus des réseaux sociaux de votre site. Cela peut être configuré page par page, en définissant la variable de page og_image . Si pour une page individuelle, cette variable n'est pas définie, le thème reviendra à une variable og_image à l'échelle du site, configurable dans votre _config.yml . Dans les cas spécifiques à la page et à l'échelle du site, la variable og_image doit contenir l'URL de l'image que vous souhaitez afficher dans les aperçus des réseaux sociaux.
Il génère un flux Atom (de type RSS) de vos publications, utile pour les lecteurs Atom et RSS. Le flux est accessible simplement en tapant après votre page d'accueil /feed.xml . Par exemple, en supposant que le point de montage de votre site Web soit le dossier principal, vous pouvez saisir yourusername.github.io/feed.xml
Par défaut, il y aura une section d'articles connexes au bas des articles de blog. Ceux-ci sont générés en sélectionnant les publications les plus récentes max_related partagent au moins les balises min_common_tags avec la publication actuelle. Si vous ne souhaitez pas afficher les publications associées sur une publication spécifique, ajoutez simplement related_posts: false au début de la publication. Si vous souhaitez le désactiver pour toutes les publications, définissez simplement enabled sur false dans la section related_blog_posts de _config.yml .
Les contributions à al-folio sont les bienvenues ! Avant de commencer, veuillez consulter les directives.
Si vous souhaitez améliorer la documentation, ajouter votre page Web à la liste ci-dessous ou corriger une incohérence ou un bug mineur, n'hésitez pas à envoyer un PR directement à master . Pour des problèmes/bogues ou demandes de fonctionnalités plus complexes, veuillez ouvrir un problème en utilisant le modèle approprié.
Nos contributeurs les plus actifs sont invités à rejoindre l’équipe des responsables. Si vous êtes intéressé, n'hésitez pas à nous contacter !
Maruan | Rohan Deb Sarkar | Amir Pourmand | Georges |
Réalisé avec contrib.rocks.
Le thème est disponible en open source selon les termes de la licence MIT.
A l'origine, al-folio était basé sur le thème *folio (publié par Lia Bogoev et sous licence MIT). Depuis lors, les styles ont été entièrement réécrits et de nombreuses fonctionnalités supplémentaires intéressantes.
