Cyber Monday Sale 40% off unlimited courses & creative assets! 40% off unlimited assets! Save Now
Advertisement
  1. Web Design
  2. Jekyll

Настраиваем Jekyll для GitHub Pages за 60 Секунд

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

Russian (Pусский) translation by Anton L (you can also view the original English article)

Jekyll может быть использован вместе с GitHub Pages для создания простого блога, или статичного веб-сайта. Это видео покажет вам как настроить файловую структуру Jekyll для Github Pages за 60 секунд!

Как только вы всё настроите и вам нужно будет вдохновение, обратите внимание на доступные темы для Jekyll на Envato Market.

Если вы больше предпочитаете текстовые инструкции, вот весь процесс, описанный шаг за шагом.

Новый проект

Для начала создайте папку для вашего нового репозитория. Сделайте это используя терминал, переместитесь в то место где вы планируете создать новую директорию и напишите команду mkdir mysite. Моя новая папка называется «mysite», но вы можете её назвать как угодно.

Переместитесь в только что созданную папку командой cd mysite, когда вы окажитесь там создайте новый файл конфигурации vim _config.yml. Ваш терминал покажет вам контент этого файла, нажмите i для переключения в режим ввода, затем добавьте следующий контент:

Нажмите Esc, чтобы покинуть режим ввода, затем :x для сохранения изменений.

Создайте Index

Далее нам нужно создать документ index, так что введите команду vim index.md и также как мы делали до этого, добавьте контент:

Добавьте Папку Layouts

Теперь создайте новую директорию командой mkdir _layouts и перейдите в неё cd _layouts. Создайте дефолтный шаблон vim default.html и добавьте контент:

Инициализируйте Новый Репозиторий

Теперь нам нужно инициализировать новый репозиторий и закомитить изменения. Начните с перемещения в корень нашего проекта cd ... Затем введите git init, после чего git add --all && git commit --all.

Пушим на GitHub

Откройте  с помощью вашего браузера сайт GitHub'а и создайте репозиторий.

Вам будет предложено несколько вариантов, скопируйте команды рядом с надписью push an existing repository from the command line. Эти команды будут выглядеть примерно так:

Скопируйте их в свой терминал для того, чтобы запушить локальный репозиторий на GitHub.

Настройки GitHub

Ну и наконец, в Settings репозитория на GitHub, выбирите использовать master ветку для GitHub Pages и нажмите Save.

Jekyll теперь установлен, вы можете делать свой веб-сайт!

Объясняем Файловую Структуру Jekyll

  • _config.yml служит для конфигурации Jekyll. Здесь GitHub Pages ищет настройки сайта, такие, как глобальные переменные и так далее.
  • index.md корневой индексный документ сайта для GitHub Pages.
  • _layouts/default.html дефолтный шаблон, который будет использоваться для index.md.

Полезные ссылки

Для получения большей информации о том как делать веб-сайты на Jekyll, обратите внимание на следующие ресурсы на 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.