Недавно я мигрировали мой блог с WordPress, чтобы Джекила, фантастический веб-сайт генератор, который разработан для создания минимальных, статические блоги быть размещен на GitHub Pages.Простота тематизации слоя Джекила и записи процесса является фантастическим;Однако, создание мой сайт взял много больше, чем ожидалось .

В этой статье мы будем ходить через следующее:

• Быстрый способ создать Джекил питание блог;
• Как избежать распространенных проблем при использовании Джекил;
• Как импортировать содержимое из WordPress, использовать свое собственное доменное имя, и блог в вашем любимом редакторе;
• Как тема в Джекил, с примерами жидких шаблонных;
• Пара новых функций Джекил 2,0, в том числе Сасс и CoffeeScript поддержки и коллекций .

Джекила Простой Purpose

Том Престон-Вернер создал Джекил, чтобы люди в блог с помощью простой статический HTML веб-сайт, с все содержимое размещается и управляемым версией на GitHub.Цель в том, чтобы устранить сложность других платформ блогов, создав рабочий процесс, который позволяет блог вроде hacker ¹ .

Джекил занимает свое содержание, написанный на Markdown, пропускает его через шаблоны и выплевывает в виде полного статического сайта, можно подавать к столу.GitHub Pages удобно служит веб-сайт непосредственно из вашего хранилища, GitHub, так что вам не придется иметь дело с любым хостинг .

Вот некоторые сайты, которые были созданы с Джекила:

• Blog__20 Барри Кларка | 3 (это я)
• Зака ​​Холмена blog ⁴
• CSS Wizardry ⁵
• Jekyll ⁶
• HealthCare.gov ⁷ ‘ы целевая страница и содержание subpages
• Разработка Seed ⁸

Преимущества Going Static

• SimplicityДжекил-полоски все до минимума, устраняя много сложностей:
  не
  • Нет databaseВ отличие от WordPress и других систем управления контентом (CMS), Джекил не имеет базы данных.Все сообщения и страницы, преобразованных в статический HTML до публикации.Это очень удобно для скорости загрузки, потому что никакие обращения к базе данных не производится, когда страница загружена .
  • Нет CMSПросто напишите все ваше содержание в Markdown, и Джекил будет запустить его через шаблоны для создания своих статический сайт.В случае необходимости, потому что вы можете редактировать контент на это .__ 10 GitHub может служить CMS |
  • FastДжекил быстро, потому что, будучи урезанная и без базы данных, вы просто обслуживает до статические страницы.Моя база тема, Джекил Now ^{50 25 15 9} , составляет всего три HTTP запросов — в том числеизображение профиля и социальные иконки
  • MinimalВаш сайт Джекил не будет включать в себя абсолютно не функциональные возможности или функции, которые вы не используете .
• Дизайн controlТратьте меньше времени борьба с комплексными шаблонов, написанных другими людьми, и больше времени на создание собственной темы и настройке несложный базовой темы .
• SecurityПодавляющее большинство уязвимостей, которые влияют на платформы, такие как WordPress не существует, потому что Джекил не имеет CMS, базы данных или PHP.Таким образом, вам не придется тратить столько времени на установку обновлений безопасности .
• Удобный hostingУдобный, если вы уже используете GitHub, что есть.GitHub Страницы будут строить и разместить свой сайт Джекил на безвозмездной основе, в то же время обработки контроль версий .

Давайте попробуем Out

Есть несколько способов, чтобы начать работу с Джекила, каждый со своими вариациями.Вот несколько вариантов:

• Установка Джекил локально с помощью командной строки, создайте новый шаблонный сайт с помощью jekyll new, построить его на месте с jekyll build, а затем служить ему.( Джекил website ¹⁰ Выставки этот процесс.)
• Clone отправной точкой для вашей локальной машине, установите Джекил локально с помощью командной строки, убедитесь, обновления вашего сайта, построить его локально, а затем служить ей .
• Вилка отправную точку, внести изменения, а затем служить ей .

Мы начну с самой быстрой и простой вариант: порождения отправную точку.Это позволит получить нам и работает в течение нескольких минут, и у нас не будет устанавливать никаких зависимостей.Вот то, что мы собираемсясделать прямо на GitHub.com в браузере:

1. Создать наша Джекил питание сайт .
2. Разместить его бесплатно на GitHub Pages .
3. Настроить его включить наше имя, аватар и социальных связей .
4. Опубликовать свой первый пост в блоге

1. Вилка Начиная Point

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

Я подготовил хранилище для нас уже.Отправляйтесь в Джекил Now ¹¹ , и нажмите кнопку “вилка” в верхнем правом углу хранилище раскошелиться копию теме блога на ваш счет GitHub .

¹²

Начиная с вилкой здорово, потому что это даст вам почувствовать, что Джекил, как перед тем, как настроить локальную среду разработки, устанавливать зависимости и выяснить процесс сборки Джекила .

Общие проблемы # 1 Создание сайта Джекил через локальную командной строки может быть неприятно и требует много времени, потому что вы должны установки и настройки dependencies как Руби и RubyGems.Пусть GitHub Pages создания веб-сайта для вас, пока вы не будете иметь реальную необходимость создания локально .

2. размещаться на вашем GitHub Account

Как пользователь GitHub, вы имеете право на один бесплатный сайт “пользователя” (в отличие от веб-сайта «Проект»), который будет жить в http://yourusername.github.io.Это пространство идеально подходит для проведения блог Джекил

Самое приятное, что вы можете просто разместить под застройку Джекил блог на главном отделении вашего хранилища пользователей и GitHub Pages будет строить статический сайт и служить его для вас.Вы не должны беспокоиться о процессе сборки вообще — это все заботятся .

Нажмите кнопку “Настройки” в вашем новом раздвоенной хранилища (в меню справа), а также изменить имя репозитория до yourusername.github.io, заменяя yourusername с GitHub имя пользователя .

Ваш сайт будет, вероятно, в силу сразу же.Вы можете проверить, зайдя в http://yourusername.github.io.Не волнуйтесь, если он еще не жить: Шаг 3 заставит его быть построен .

¹⁴

Вот так!Мы движемся быстро здесь.У нас уже есть веб-сайт Джекил и работает!Давайте сделаем шаг назад для второй и посмотрим на некоторые из наиболее распространенных вопросов, которые необходимо учитывать при хостинг веб-сайт Джекил на GitHub Pages .

Общие проблемы # 2: Будьте в курсе разницы между веб-сайтов пользователей и проекта websites ¹⁷ на GitHub.С веб-сайта пользователя (который мы настраиваем), вам не нужно делать каких-либо разветвление.master Филиал уже настроен для работы ничего, возложенные на него через Джекила.Вам не нужно настроить gh-pages Филиал .

Общие проблемы # 3 Использование веб-сайта проекта для вашего сайта Джекил вносит некоторую complexity ¹⁸ потому, что ваш сайт будет опубликован в подкаталоге.URL будет выглядеть http://yourname.github.io/repository-name, что может вызвать проблемы в шаблонах Джекила, такие как разделение ссылки на картинки и не позволяя просматривать веб-сайт локально .

Общие проблемы # 4: Джекил имеет много plugins ¹⁹ , но GitHub Pages поддерживает только несколько из them ²⁰ .Если вы попытаетесь включить плагин, который не поддерживается, то Джекил не удастся при строительстве вашего веб-сайта.Таким образом, придерживаться в список поддерживаемых.К счастью, мой любимый плагин в списке: Jemoji ²¹ позволяет включать смайлики в блогах, как вы бы на GitHub и Basecamp .

3. Настройте Ваше Website

Теперь вы можете изменить вашего сайта имя, описание аватари другие варианты, отредактировав _config.yml файл.Эти пользовательские переменные были созданы для удобства и потянули в вашей теме, когда ваш сайт будет построен .

Внесения изменений в _config.yml (или любой другой файл в вашем репозитории) заставит GitHub Pages, чтобы восстановить ваш сайт с Джекила.Сайт восстановлен будут видны через несколько секунд при температуре http://yourusername.github.io.Если ваш сайт не был в прямом эфире сразу после шага 2, это будет после этого шага .

Идем дальше и настроить свой сайт, обновляя переменные в _config.yml файл, а затем принятие изменений .

Вы можете изменять файлы вашего блога отсюда на в одном из трех способов.Выберите какой подходит вам лучше всего:

• Редактирование файлов в ваш новый username.github.io хранилище непосредственно в браузере в GitHub.com (как показано ниже) .
• Использование сторонних GitHub контент-редактор, например, Prose ²² семенами развития.Он оптимизирован для Джекила, который позволяет легко редактировать Markdown, напишите проекты и загружать изображения .
• Clone ваш репозиторий и сделать обновления локально, а затем подтолкнуть их в репозиторий GitHub ( Atlassian имеет guide ²³ об этом) .

²⁴

Общие проблемы # 5: Не думайте, что вам нужно jekyll build сайт локально, чтобы настроить и тематические веб-сайт Джекил.GitHub Pages сделает это за вас.Вам просто нужно поместить файлы, которые вы хотите быть построен в главном отделении вашего хранилища пользователей или gh-pages Филиал любого другого хранилища, а затем GitHub Pages будет обрабатывать его с Джекила .

4. Опубликовать свой первый блог Post

Ваш сайт в настоящее время настроены, живая и хорошо выглядеть.Вы просто должны опубликовать свой первый пост в блоге:

1. Редактировать /_posts/2014-3-3-Hello-World.md, удаляя при этом содержимое заполнителя ивведя свой собственный.Если вам нужно быстро праймер на написание в Markdown, проверьте чит sheet__1 Адама Притчарда | 27 .
2. Измените имя файла, чтобы включить текущую дату и название вашего поста.Джекил требуется сообщения, чтобы быть названным year-month-day-title.md .
3. Обновление титул в верхней части файла Markdown.Эти переменные в верхней части блоге называются переднюю вопрос, который мы будем копаться в немного позже.В этом случае, они указывают, макет которого в использовании и название блоге. Дополнительная титульные variables ²⁸ существуют, например, permalink, tags и category .

Если вы хотите создать новую запись в блоге в браузере на GitHub.com, просто нажмите на значок “” в /_posts/.Только не забудьте отформатировать имя файла неправильно и включить блок предисловия, так что файл будет обработан Джекил .

²⁹

Общие проблемы # 6: Одна из проблем у меня было об использовании Джекил для моего блога в том, что он не имеет CMS, так что я бы не удобство в состоянии сделать быстрые редактирования, войдя в интерфейс CMS, когда янахожусь далеко от моего ноутбука.Оказывается, что ваш блог Джекил будет иметь CMS, если вы используете GitHub Pages, потому что сама GitHub служит CMS.Вы можете редактировать сообщения в браузере, даже на смартфоне, если хотите.Это может быть не так удобно, как другие CMS », но вы не будете застрял, когда вы находитесь далеко от компьютера и нужно внести изменения .

Дополнительно Steps

Use Your Own Domain

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

1. Вернуться в корень хранилища блога, и отредактировать файл CNAME включить свое доменное имя (например, www.yourdomainname.com) .
2. Перейти к регистрации доменных имен, а также добавить запись CNAME DNS указывая свой домен в GitHub Страницы:
   • Тип: CNAME
   • Хост: www.yourdomainname.com
   • Ответ: yourusername.github.io
   • TTL: 300

Тогда, обновления Какой у меня DNS ³¹ как сумасшедший, пока вы не распространяются.Если вы запуститев каких-либо проблем, обратитесь к “ Настройка пользовательского домена с GitHub Pages ³² .”

Импорт вашем блоге сообщения от WordPress

Перед импортом, вам нужно экспортировать данные из WordPress, возможно, массируя данные немного (например, обновление ссылок изображения), а затем импортировать его в ваш новый сайт Джекил.К счастью, несколько большие средства могут помочь .

Для экспорт из WordPress, я настоятельно рекомендую один клик __14 Бен Балтер в | WordPress для Джекила Exporter ³³ плагина.Она экспортирует все ваши WordPress содержание в виде архива, в том числе сообщений, изображений и мета-данных, преобразование его в формат Джекила, где это необходимо.Хорошо на вас, Бен .

Другой вариант, чтобы экспортировать все сообщения в меню “Инструменты” приборной панели WordPress, а затем импортировать его с Джекила importer ³⁴ .

Далее, мы должны обновить наш имидж references.Плагин Бен Балтер будет экспортировать все ваши изображения в папке.Затем, вам нужно скопировать их туда, где вы размещаете свои изображения на своем блоге Джекил.Это может быть в /images папке или в сети доставки контента .

Тогда, у вас есть удовольствие задачу обновления всех ссылок на эти изображения через ваш контент WordPress.Потому что я только обновления пять или шесть сообщения, быстро найти и заменить работал хорошо, но если у вас есть много контента, то это может быть стоит писать сценарий или проверить сценарии, которые пишут другие, такие как Пол Stamatiou’s ³⁵ .

Наконец, мы должны импорт comments.Будучи платформой для статических сайтов, Джекил браузер не поддерживает комментарии.Тем не менее, серверное решение, как Disqus работает очень хорошо!Я рекомендую импорт на WordPress комментарии Disqus ³⁶ .Затем, если вы используете Джекил Теперь вы можете ввести свой …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров