Из коробки Octopress умеет выдавать кнопки от google+, twitter и facebook. Для их размещения внизу каждой страницы достаточно прописать эти настройки в файле _config.yml:
123facebook_like: truegoogle_plus_one: truetwitter_tweet_button: true
А сейчас мы научим Octopress добавлять кнопку «Мне нравится!» от социальной сети «В контакте».
Вводим название своего сайта здесь, чтобы получить api Id — идентификатор контактовского виджета для Вашего сайта. Там и получаем код, который надо будет вставить. Код меняется в зависимости от того, какие параметры кнопки выбрать, так что мой код может Вам не подойти — тогда пользуйтесь тем кодом, который вам выдаст «В контакте».
Создаём файл source/_includes/vk_head.html с таким содержанием:
12345<script type=»text/javascript» src=»//vk.com/js/api/openapi.js?116″></script><script type=»text/javascript»>VK.init({apiId: Номер_Вашего_ID, onlyWidgets: true});</script>
Этот код пойдёт внутри <head>. Не забудьте вставить Ваше apiId. Затем добавьте в конец файла source/_includes/custom/head.html:
123{% if site.vk_like %}{% include head.html %}{% endif %}
Создавайте файл source/_includes/vk_sharing.html:
123<script type=»text/javascript»>VK.Widgets.Like(«vk_like», {type: «button»});</script>
Этот код пойдёт в том месте, где мы хотим нашу кнопку.
Добавляйте в конец файла source/_includes/post/sharing.html:
123{% if site.vk_like %}<div id=»vk_like»></div>{% endif %}
Добавьте в файл source/_includes/custom/after_footer.html:
123{% if site.vk_like %}{% include vk_sharing.html %}{% endif %}
Добавьте в файл _config.yml строку:
1vk_like: true
Почти готово. Осталось только расположить кнопку в нужном месте. Если у Вас есть кнопки от Twitter, Google+ и Facebook (с английским словом Like — по умолчанию Octopress и добавляет английскую кнопку), то подойдёт стиль со следующими цифрами, который можно записать в sass/custom/_styles.scss:
1234#vk_like {margin: 0 0 0 80px; padding: 25px 0 33px 0px;}@media screen and (min-width: 520px){ #vk_like {margin: -28px 0 0 320px; padding: 0 0 30px 0;}}
Так кнопка «Мне нравится» от «В контакте» стройно встанет в ряд с остальными кнопками. При ширине окна меньше 520 пикселей кнопка «Мне нравится» съедет во второй ряд и ровненько при этом займёт место посередине под этими тремя. Впрочем, если что-то Вас не устраивает, поменяйте цифры. Отключить кнопку можно, прописав в _config.yml параметр
1vk_like: false
Так что процесс автоматизирован. Будьте только внимательны при смене темы — файл source/_includes/post/sharing.html, скорее всего, будет переписан. Зато все файлы, которые мы создали, и все файлы из поддиректорий custom должны сохраниться. Впрочем, бэкапиться перед сменой темы всё равно необходимо.