Простая, понятная и отзывчивая тема Jekyll для ученых. Если вам нравится тема, поставьте ей звезду!
Хотите узнать больше о Джекилле? Ознакомьтесь с этим руководством. Почему Джекилл? Прочтите запись в блоге Андрея Карпати!
Чтобы получить практическое руководство по установке al-folio, посмотрите этот замечательный видеоурок, написанный одним из участников сообщества! ? ?
Предпочтительный способ использования этого шаблона — нажать «Использовать этот шаблон» над списком файлов. Затем создайте новый репозиторий на github.com:<your-username>/<your-repo-name>
. Если вы планируете загрузить свой сайт в <your-github-username>.github.io
, обратите внимание, что имя вашего репозитория должно быть <your-github-username>.github.io
или <your-github-orgname>.github.io
, как указано в документации страниц GitHub. Дополнительную информацию о том, как развернуть ваш сайт, можно найти в разделе «Развертывание» ниже. После того, как вы создали новый репозиторий, просто загрузите его на свой компьютер:
$ git clone [email protected]: < your-username > / < your-repo-name > .git
$ cd < your-repo-name >
Использование Docker для установки зависимостей Jekyll и Ruby — самый простой способ.
Вам необходимо предпринять следующие шаги, чтобы запустить al-folio
на локальном компьютере:
$ docker compose pull
$ docker compose up
Обратите внимание, что при первом запуске он загрузит образ докера размером 400 МБ или около того.
Теперь вы можете настраивать тему по своему усмотрению (не забудьте изменить имя!). После того, как вы закончите, вы можете использовать ту же команду ( docker compose up
), чтобы отобразить веб-страницу со всеми внесенными вами изменениями. Также не забудьте зафиксировать окончательные изменения.
Чтобы изменить номер порта, вы можете отредактировать файл
docker-compose.yml
.
Примечание. Этот подход необходим только в том случае, если вы хотите создать более старую или очень специальную версию al-folio.
Создайте и запустите новый образ докера, используя:
$ docker compose up --build
Если вы хотите обновить jekyll, установить новые пакеты Ruby и т. д., все, что вам нужно сделать, это заново собрать образ, используя аргумент
--force-recreate
в конце предыдущей команды! Он загрузит Ruby и Jekyll и снова установит все пакеты Ruby с нуля.
Если вы хотите использовать определенную версию Docker, вы можете сделать это, изменив latest
тег на your_version
в docker-compose.yaml
. Например, вы могли создать свой веб-сайт на v0.10.0
и хотите придерживаться этой версии.
Предполагая, что в вашей системе установлены Ruby и Bundler ( подсказка: для простоты управления драгоценными камнями Ruby рассмотрите возможность использования rbenv ), а также Python и pip ( подсказка: для простоты управления пакетами Python рассмотрите возможность использования виртуальной среды, такой как venv или conda Если вы будете использовать только jupyter
, вы можете использовать pipx ).
$ bundle install
# assuming pip is your Python package manager
$ pip install jupyter
$ bundle exec jekyll serve --lsi
Теперь вы можете настраивать тему по своему усмотрению (не забудьте изменить имя!). После завершения зафиксируйте последние изменения.
Развертывание вашего веб-сайта на GitHub Pages — самый популярный вариант. Начиная с версии 0.3.5, al-folio будет автоматически повторно развертывать вашу веб-страницу каждый раз, когда вы добавляете новые изменения в свой репозиторий!
Для личных и корпоративных веб-страниц:
<your-github-username>.github.io
или <your-github-orgname>.github.io
._config.yml
установите url
https://<your-github-username>.github.io
и оставьте baseurl
пустым.<your-github-username>.github.io
.Для страниц проекта:
_config.yml
установите url
https://<your-github-username>.github.io
и baseurl
в /<your-repository-name>/
.<your-github-username>.github.io/<your-repository-name>/
.Чтобы включить автоматическое развертывание:
master
ветке ваш репозиторий теперь должен иметь новую ветку gh-pages
.gh-pages
( НЕ на master
). Дополнительные сведения см. в разделе Настройка источника публикации для вашего сайта GitHub Pages. Если вы храните свой сайт в другой ветке, откройте .github/workflows/deploy.yml
в ветке, в которой вы храните свой сайт , и измените on->push->branches и on->pull_request->branches на ветку, в которой вы храните свой сайт. на. Это вызовет действие при вытягивании/толкании в этой ветке. Затем действие развернет веб-сайт в той ветке, из которой оно было запущено.
Если вам нужно вручную повторно развернуть свой веб-сайт на страницах GitHub, перейдите в «Действия», нажмите «Развернуть» на левой боковой панели, затем «Запустить рабочий процесс».
Если вы решите не использовать GitHub Pages и разместить свою страницу в другом месте, просто запустите:
$ bundle exec jekyll build --lsi
который (повторно) сгенерирует статическую веб-страницу в папке _site/
. Затем просто скопируйте содержимое каталога _site/
на ваш хостинг-сервер.
Если вы также хотите удалить неиспользуемые классы CSS из вашего файла, запустите:
$ purgecss -c purgecss.config.js
который заменит файлы CSS в папке _site/assets/css/
очищенными файлами CSS.
Примечание. Перед созданием веб-страницы убедитесь, что поля url
и baseurl
в _config.yml
правильно установлены. Если вы развертываете свою веб-страницу на your-domain.com/your-project/
, вы должны установить url: your-domain.com
и baseurl: /your-project/
. Если вы выполняете развертывание непосредственно на your-domain.com
, оставьте baseurl
пустым.
Примечание. Не пытайтесь использовать этот метод, если вы не знаете, что делаете (убедитесь, что вы знакомы с источниками публикации). Такой подход позволяет хранить исходный код сайта в одном репозитории, а версию для развертывания — в другом.
Предположим, что источником публикации вашего веб-сайта является подкаталог publishing-source
репозитория с версией git, клонированного в $HOME/repo/
. Для пользовательского сайта это может быть что-то вроде $HOME/<user>.github.io
.
Во-первых, из каталога репозитория развертывания найдите ветку git, в которой находится ваш источник публикации.
Затем из исходного каталога веб-сайта (обычно это клон вашей вилки al-folio):
$ bundle exec jekyll build --lsi --destination $HOME /repo/publishing-source
Это даст указание jekyll развернуть веб-сайт в $HOME/repo/publishing-source
.
Примечание. Перед сборкой Jekyll очистит $HOME/repo/publishing-source
!
Цитата ниже взята непосредственно из документации по конфигурации jekyll:
Папки назначения очищаются при сборке сайта.
Содержимое
<destination>
автоматически очищается по умолчанию при создании сайта. Файлы и папки, созданные не вашим сайтом, будут удалены. Некоторые файлы можно сохранить, указав их в директиве конфигурации<keep_files>
.Не используйте важное местоположение для
<destination>
; вместо этого используйте его как промежуточную область и копируйте оттуда файлы на свой веб-сервер.
Если $HOME/repo/publishing-source
содержит файлы, которые вы хотите, чтобы jekyll оставил нетронутыми, укажите их в разделе keep_files
в _config.yml
. В конфигурации по умолчанию al-folio скопирует README.md
верхнего уровня в источник публикации. Если вы хотите изменить это поведение, добавьте README.md
в раздел exclude
в _config.yml
.
Примечание. Не запускайте jekyll clean
в репозитории исходного кода публикации, так как это приведет к удалению всего каталога, независимо от содержимого keep_files
в _config.yml
.
Если вы установили al-folio, как описано выше, вы можете настроить действие GitHub для автоматической синхронизации вашего репозитория с последней версией темы.
Перейдите в «Настройки» -> «Действия» -> «Основные» -> «Разрешения рабочего процесса», дайте разрешения на чтение и запись для действий GitHub, установите флажок «Разрешить действиям GitHub создавать и утверждать запросы на включение» и сохраните изменения.
Затем перейдите в Действия -> Новый рабочий процесс -> настройте рабочий процесс самостоятельно, настройте следующий рабочий процесс и зафиксируйте изменения:
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 : master
Вы получите запрос на включение в свой репозиторий, если в шаблоне будут доступны какие-либо изменения.
Другой вариант — обновить код вручную, выполнив следующие действия:
# 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
Если вы тщательно настроили предыдущую версию, обновить ее может быть сложнее. Вы по-прежнему можете выполнить описанные выше шаги, но git rebase
может привести к конфликтам слияния, которые необходимо разрешить. Дополнительную информацию см. в руководстве по git rebase и о том, как разрешать конфликты. Если перебазирование слишком сложное, мы рекомендуем переустановить новую версию темы с нуля и перенести содержимое и изменения из предыдущей версии вручную.
Вот некоторые часто задаваемые вопросы. Если у вас есть другой вопрос, задайте его в разделе «Обсуждения».
Вопрос: После того как я создаю новый репозиторий на основе этого шаблона и настраиваю его, я получаю сообщение об ошибке развертывания. Разве веб-сайт не должен корректно развертываться автоматически?
О: Да, если вы используете версию v0.3.5
или новее, веб-сайт будет автоматически и правильно повторно развернут сразу после вашего первого коммита. Пожалуйста, внесите некоторые изменения (например, измените информацию о своем веб-сайте в _config.yml
), зафиксируйте и нажмите. Обязательно следуйте инструкциям по развертыванию, приведенным в предыдущем разделе. (Соответствующий выпуск: 209.)
Вопрос: Я использую собственный домен (например, foo.com
). Мой личный домен становится пустым в настройках репозитория после каждого развертывания. Как мне это исправить?
О: Вам необходимо добавить файл CNAME
в master
или source
ветку вашего репозитория. Файл должен содержать ваше собственное доменное имя. (Соответствующий выпуск: 130.)
Вопрос: Моя веб-страница работает локально. Но после развертывания он не может собраться и выдает Unknown tag 'toc'
. Как мне это исправить?
О: Убедитесь, что вы выполнили инструкции по развертыванию, приведенные в предыдущем разделе. Вы должны были установить ветку развертывания gh-pages
. (Связанный выпуск: 1438.)
Вопрос: Моя веб-страница работает локально. Но после развертывания он отображается некорректно (некорректно загружаются CSS и JS). Как мне это исправить?
О: Обязательно правильно укажите пути url
и baseurl
в _config.yml
. Установите url
https://<your-github-username>.github.io
или https://<your.custom.domain>
если вы используете личный домен. Если вы развертываете личный или корпоративный веб-сайт, оставьте baseurl
пустым. Если вы развертываете страницу проекта, установите baseurl: /<your-project-name>/
. Если все предыдущие шаги были выполнены правильно, вашему браузеру не хватает только повторного получения таблицы стилей сайта.
Вопрос: Не работает канал Atom. Почему?
О: Обязательно правильно укажите пути url
и baseurl
в _config.yml
. Плагин RSS Feed работает с правильно настроенными полями: title
, url
, description
и author
. Обязательно заполните их правильно и повторите попытку.
Вопрос: Мой сайт не работает, когда я включаю related_blog_posts
. Почему?
О: Вероятно, это связано с плагином классификатора reborn, который используется для подсчета связанных постов. Если ошибка гласит Liquid Exception: Zero vectors can not be normalized...
, это означает, что не удалось вычислить связанные сообщения для конкретного сообщения. Обычно это вызвано пустыми или минимальными сообщениями в блоге без значимых слов (т. е. только стоп-слов) или даже определенных символов, которые вы использовали в своих сообщениях. Кроме того, подсчет похожих публикаций производится для каждого post
, то есть для каждой страницы, на которой используется layout: post
, включая объявления. Чтобы изменить это поведение, просто добавьте related_posts: false
в начало страницы, на которой вы не хотите отображать похожие сообщения.
Вопрос: При попытке развертывания запрашиваются учетные данные для входа в GitHub, GitHub отключил аутентификацию по паролю и завершает работу с ошибкой. Как исправить?
О: Откройте файл .git/config в предпочитаемом вами редакторе. Измените часть https
переменной url
на ssh
. Попробуйте развернуть еще раз.
Страница ваших публикаций создается автоматически на основе вашей библиографии BibTex. Просто отредактируйте _bibliography/papers.bib
. Вы также можете добавлять новые файлы *.bib
и настраивать внешний вид своих публикаций по своему усмотрению, редактируя _pages/publications.md
.
В публикациях запись об авторе идентифицируется строковым массивом scholar:last_name
и строковым массивом scholar:first_name
в _config.yml
:
scholar :
last_name : [Einstein]
first_name : [Albert, A.]
Если запись соответствует одной форме фамилий и имен, она будет подчеркнута. Храните метаинформацию о своих соавторах в _data/coauthors.yml
, и Jekyll автоматически вставит ссылки на их веб-страницы. Формат данных соавтора в _data/coauthors.yml
следующий:
" 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_Bach
Если запись соответствует одной из комбинаций фамилий и имен, она будет выделена и связана с предоставленным URL-адресом.
Существует несколько пользовательских ключевых слов bibtex, которые вы можете использовать, чтобы повлиять на отображение записей на веб-странице:
abbr
: добавляет сокращение слева от записи. Вы можете добавить к ним ссылки, создав файл location.yaml в папке _data и добавив соответствующие записи.abstract
: добавляет кнопку «Abs», которая при нажатии раскрывает скрытое текстовое поле и отображает абстрактный текст.arxiv
: добавляет ссылку на веб-сайт Arxiv (Примечание: добавляйте сюда только идентификатор arxiv — ссылка генерируется автоматически)bibtex_show
: добавляет кнопку «Нагрудник», которая расширяет скрытое текстовое поле с полной записью библиографии.html
: вставляет кнопку «HTML», перенаправляющую на указанную пользователем ссылку.pdf
: добавляет кнопку «PDF», перенаправляющую на указанный файл (если не указана полная ссылка, предполагается, что файл находится в каталоге /assets/pdf/)supp
: добавляет кнопку «Supp» к указанному файлу (если полная ссылка не указана, предполагается, что файл находится в каталоге /assets/pdf/)blog
: добавляет кнопку «Блог», перенаправляющую на указанную ссылку.code
: добавляет кнопку «Код», перенаправляющую на указанную ссылку.poster
: добавляет кнопку «Плакат», перенаправляющую на указанный файл (если не указана полная ссылка, предполагается, что файл находится в каталоге /assets/pdf/)slides
: добавляет кнопку «Слайды», перенаправляющую на указанный файл (если не указана полная ссылка, предполагается, что файл находится в каталоге /assets/pdf/).website
: добавляет кнопку «Веб-сайт», перенаправляющую на указанную ссылку.altmetric
: добавляет значок Altmetric (Примечание: если указан DOI, просто используйте true
, в противном случае добавьте сюда только идентификатор altmetric — ссылка генерируется автоматически)dimensions
: добавляет значок «Измерения» (Примечание: если указан DOI или PMID, просто используйте true
, в противном случае добавьте сюда только идентификатор «Измерения» — ссылка генерируется автоматически)Вы можете реализовать свои собственные кнопки, отредактировав файл bib.html.
В этой теме Jekyll реализованы collections
, позволяющие разбить вашу работу на категории. Тема поставляется с двумя коллекциями по умолчанию: news
и projects
. Элементы из подборки news
автоматически отображаются на главной странице. Элементы из коллекции projects
отображаются в адаптивной сетке на странице проектов.
Вы можете легко создавать свои собственные коллекции, приложения, рассказы, курсы или любую другую творческую работу. Для этого отредактируйте коллекции в файле _config.yml
, создайте соответствующую папку и создайте целевую страницу для вашей коллекции, аналогичную _pages/projects.md
.
al-folio поставляется со стильными макетами страниц и сообщений в блогах.
Тема позволяет создавать посты в блоге в стиле distill.pub:
Более подробную информацию о том, как создавать посты в стиле дистилляции с использованием тегов <d-*>
, см. в примере.
al-folio поддерживает быструю математическую верстку с помощью MathJax и подсветку синтаксиса кода с использованием стиля GitHub:
Форматирование фотографий упрощается с помощью системы сеток Bootstrap. Легко создавайте красивые сетки в сообщениях блога и на страницах проектов:
al-folio использует github-readme-stats и github-profile-trophy для отображения репозиториев GitHub и статистики пользователей на странице /repositories/
.
Отредактируйте файл _data/repositories.yml
и измените списки github_users
и github_repos
, включив свой собственный профиль GitHub и репозитории на страницу /repositories/
.
Вы также можете использовать следующие коды для отображения этого на любых других страницах.
<!-- 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 %}
На ваш выбор было выбрано множество красивых цветов темы. По умолчанию — фиолетовый, но вы можете быстро изменить его, отредактировав переменную --global-theme-color
в файле _sass/_themes.scss
. Там же перечислены и другие цветовые переменные. Доступные варианты цвета стандартной темы можно найти по адресу _sass/_variables.scss
. Вы также можете добавить в этот файл свои собственные цвета, присвоив каждому имя для удобства использования в шаблоне.
al-folio поддерживает предварительный просмотр изображений в социальных сетях. Чтобы включить эту функцию, вам нужно будет установить для serve_og_meta
значение true
в вашем _config.yml
. Как только вы это сделаете, все страницы вашего сайта будут включать данные Open Graph в элемент заголовка HTML.
Затем вам нужно будет настроить, какое изображение будет отображаться в предварительном просмотре вашего сайта в социальных сетях. Это можно настроить для каждой страницы, установив переменную страницы og_image
. Если для отдельной страницы эта переменная не установлена, то тема будет использовать переменную og_image
для всего сайта, настраиваемую в вашем _config.yml
. Как в случае конкретной страницы, так и в случае всего сайта переменная og_image
должна содержать URL-адрес изображения, которое вы хотите отображать при предварительном просмотре в социальных сетях.
Он генерирует канал ваших сообщений в формате Atom (RSS-подобный), что полезно для читателей Atom и RSS. Доступ к фиду можно получить, просто набрав после домашней страницы /feed.xml
. Например, если предположить, что точка монтирования вашего веб-сайта является основной папкой, вы можете ввести yourusername.github.io/feed.xml
По умолчанию в нижней части сообщений блога будет раздел похожих сообщений. Они генерируются путем выбора самых последних сообщений max_related
, которые имеют как минимум общие теги min_common_tags
с текущим сообщением. Если вы не хотите отображать похожие сообщения в конкретном сообщении, просто добавьте related_posts: false
в начало сообщения. Если вы хотите отключить его для всех сообщений, просто установите для enabled
значение false в разделе related_blog_posts
в _config.yml
.
Вклад в аль-фолио приветствуется! Прежде чем приступить к работе, пожалуйста, ознакомьтесь с рекомендациями.
Если вы хотите улучшить документацию, добавить свою веб-страницу в список ниже или исправить незначительное несоответствие или ошибку, отправьте PR непосредственно в master
. Для более сложных проблем/ошибок или запросов на добавление функций откройте проблему, используя соответствующий шаблон.
Наши самые активные участники приглашаются присоединиться к команде сопровождающих. Если вам интересно, обращайтесь!
Маруан | Рохан Деб Саркар | Амир Пурманд | Джордж |
Сделано с помощью contrib.rocks.
Тема доступна с открытым исходным кодом в соответствии с условиями лицензии MIT.
Первоначально al-folio был основан на теме *folio (опубликованной Лией Богоевой и по лицензии MIT). С тех пор стили были полностью переписаны и появилось множество дополнительных интересных функций.