Как поднять блог на Github Pages · Записная книжка



Как поднять блог на Github Pages

04 Jan 2015

Первый пост блога, инструкция.

Содержание

Лирика

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

Останавливало два фактора: лень и незнание веб-технологий(и отсутсвие большого желания изучать их). Использовать же современные готовые движки типа WordPress, Blogger или LiveJournal и иже с ними не хотелось из-за их перегруженности, “вебдванольности”, не подконтрольности мне. Да и большинство функционала, который предлагают современные блоги/дневники, мне не нужно.

И вот тут в очередной раз гуляя по Github я наталкиваюсь на Github Pages. Полчаса чтения и я понимаю — это то что нужно. Суть в чем? Сервис предлагает пользователям Github бесплатный хостинг статических html-страниц для специально созданного репозитория. Простые страницы все же не блог — так какой же от сервиса толк? Там есть генератор удобный, который из пачки шаблонов и простого текста сгенерирует сайт пользователю на радость командой одной — git push — прелесть какая.

Если коротко, то вот что меня привлекло завести блог на Github Pages:

  • отсутствие желания заниматься самому настройкой сервера, следить за обновлениями, безопасностью и все такое. На Github Pages это происходит без моего участия;
  • набор статических html-страниц, а значит быстро будет отображаться в браузере;
  • есть генератор этих самых статических страниц — Jekyll, а значит не надо будет самому заниматься версткой постов;
  • раз статические страницы, то не надо никаких баз данных, php и тому подобных вещей;
  • посты пишутся в простом markdown-формате, а значит подойдет тем кто не хочет вообще заморачиваться с html;
  • git; это значит многое: версионность, локальное хранение, безопасность(шифрованные данные же пересылаем ) и еще очень много хорошего;
  • возможность привязать к своему домену блог;
  • возможность кастомизации по самое не хочу … для тех кто хочет.

Установка и настройка окружения

Вместо чтения кучи документации по Jekyll, я нашел крутую репу poole. Как пишет ее автор:

“a clear and concise foundational setup for any Jekyll site. And it has a super minimal look… It does so by furnishing a full vanilla Jekyll install with example templates, pages, posts, and styles.”

Т.е. минимально необходимый набор для запуска блога: форкнул, поменял настройки под себя и пользуешься на здоровье. Правило “Все уже написано до нас!” работает безотказно 🙂 .

demo.getpoole.com — рабочее демо блога:

Приступим к созданию своего блога:

  • устанавливаем Ruby;
  • устанавливаем Ruby DevKit;
  • устанавливаем Jekyll. Я сначала установил генератор так: gem install jekyll. И это правильно в общем случае. Но не в случае с Github. Сайт использует не последнюю версию. И возможна такая ситуация, когда вы случайно задействуете новую фичу, которая не поддерживается той версией Jekyll, которая установлена на Github. Узнать текущую версию можно здесь. Установить требуемую версию Jekyll можно так: gem install jekyll -v x.y.z. Но гораздо проще воспользоваться готовым пакетом от самых ребят с Github: gem install github-pages, он разворачивает текущее окружение, используемое Github, у вас на компьютере;
  • клонируем репозиторий poole;
  • запускаем локально сайт, для этого в консоли переходим в папку с poole и вводим jekyll serve. После того как Jekyll запуститься, мы сможем узреть сайт по адресу http://localhost:4000. Когда вы запускаете Jekyll, он создает папку _site, в которую записывает сгенерированный блог. Каждый файл в репозитории будет скопирован внутрь папки, за исключением тех файлов/папок, которые начинаются с подчеркивания. Markdown-файлы будут автоматически конвертированы в соотв. страницы. В папке _posts должны находится посты в markdown-формате. При чем имя файла должно быть вида год-месяц-день-название_поста.md. Иначе для него не сгенерируется соответствующая html-страница. _config.yml — конфигурационный файл Jekyll, меняем его под свои надобности, подробно почитать о настройке здесь. Важное примечание: по умолчанию Jekyll при любом изменении файлов перезапишет сайт, но если вы поменяли что-то в _config.yml, то надо перезапустить Jekyll;
  • добавляем посты, меняем шаблоны и вообще делаем что желаем;
  • создаем на Github новый репозиторий с именем вида github_username.github.io;
  • заливаем/пушим в него наш блог;
  • спустя небольшое время(до получаса) блог становиться доступен по адресу http://github_username.github.io
  • если есть свой домен, то Github легко позволяет привязать его к блогу. Руководство от Github, больше инфы для тех у кого регистратор домена Namecheap.

Кастомизация

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

Дефолтная тема poole мне подошла практически идеально. Но захотелось изменить еще некоторые вещи.

Добавил три ссылки вверху:

  • О блоге
  • Архив записей — динамически формирующийся список записей, для быстрой навигации;
  • Лента — для желающих подписаться на обновления блога.

Для этого я добавил в _config.yml:

pages_list:
  О блоге: '/about'
  Архив записей: '/archive'
  Лента: '/atom.xml'

И модифицировал шаблон _layouts/default.html:

<h3 class="masthead-title">
    <a href="/" title="Home">{{ site.title }}</a>

    {% for page in site.pages_list %}
      &nbsp;&nbsp;&nbsp;
      <small><a href="{{ page[1]  }}">{{ page[0] }}</a></small>
    {% endfor %}

    <p> <small>{{ site.tagline }}</small> </p></h3>

Еще оказалось что с нуля нет поддержки тегов, что есть не классно. Для Jekyll есть отдельный плагин, который реализует теги, но в нашем случае это не подходит, так как тот Jekyll, который крутится на серверах Github, нельзя кастомизировать плагинами. Памятуя о правиле “Все написано до нас”, я полез в Google и спустя 5-ть минут решение найдено. Расписывать много не хочется, решение полностью скопировано, для наглядности будет удобно посмотреть diff. А именно файлы poole.css, index.html, post.html и tags.html.

Честно говоря я ни грамма не понял, что я за магию сделал, для того что бы теги заработали(что взять с С++ разработчика?), но все получилось и работает так как мне нужно. Вот, что крест животворящий свободный софт делает!

Итоги

Я получил личный блог/сайт, не особо окунаясь в мир веба, могу писать разной степени полезности посты и продолжать программировать на своих любимых С/С++.

Ссылки

  • официальный сайт Jekyll с очень хорошей документацией;
  • документация Github Pages;
  • poole репозиторий.
  • руководство по markdown;
  • пост чувака, на который я ориентировался при настройке блога;
  • пост чувака для настройки мультилингвальности блога;
  • настройка DNS для Namecheap домена для блога на Github;
  • пост чувака, который рассказывает как добавить поддержку тегов без плагина Jekyll;
  • репозиторий моего блога.


http://alexprivalov.org/setup-blog-on-github/

Губарь Маргарита Александровна