Как создать блог с Хьюго

• Вступление
• Предпосылки
• Шаг 1: Установите программу Hugo
• Шаг 2: Создайте свой сайт
• Шаг 3: Установите темы из репозитория Hugo
• Шаг 4: внесите некоторые основные изменения в конфигурацию
• Шаг 5. Создайте свой контент
• Шаг 6. Настройте контент с помощью сервера Hugo.
• Шаг 7: опубликуйте свой сайт

Вступление

Hugo - это генератор статических сайтов с молниеносной скоростью рендеринга и отличной простотой использования. Благодаря всем его контент-ориентированным функциям вы всегда можете сосредоточиться на создании контента, а не на создании среды:

• С помощью Hugo вы можете за несколько минут создать работающий статичный сайт без утомительных зависимостей или баз данных.
• Вы можете составить свой контент в Markdown, наиболее удобном стиле письма, и мгновенно увидеть изменения, которые вы внесли в Интернете.
• Кроме того, вы можете максимально использовать богатое хранилище тем Хьюго и быстро растущее сообщество.

В этом руководстве я покажу вам, как установить и использовать Hugo для создания статического сайта блога на экземпляре сервера Vultr LEMP на базе CentOS.

Предпосылки

Войдите в свой экземпляр как пользователь без полномочий root с разрешениями sudo. Посмотрите, как создать такого пользователя в этой статье .

Шаг 1: Установите программу Hugo

Hugo может быть установлен практически на всех основных платформах. Для CentOS вам просто нужно скачать последний файл программы в .tar.gzархив и разархивировать его в удобное место. На момент написания последней версии 0.15.

sudo yum update -y
sudo yum install git -y
cd ~
wget https://github.com/spf13/hugo/releases/download/v0.15/hugo_0.15_linux_amd64.tar.gz
tar -zxvf hugo_0.15_linux_amd64.tar.gz
sudo mv hugo_0.15_linux_amd64/hugo_0.15_linux_amd64 /usr/local/bin/hugo

Проверьте вашу установку с помощью следующей команды:

 hugo version

Шаг 2: Создайте свой сайт

С Hugo вы можете создать свой сайт из любой папки на вашем сервере. Здесь я создал сайт в каталоге mysite/под моим домашним каталогом.

cd ~
hugo new site ~/mysite

Выполните следующие команды, чтобы увидеть архитектуру сайта:

cd mysite
ls -lF

Как видите, текущая архитектура сайта выглядит следующим образом:

архетипы /

config.toml

/ содержание

данные/

макеты /

статическая /

С еще двумя создаваемыми каталогами, themes/и public/вся архитектура сайта Hugo является компактной, но всеобъемлющей.

Для начала знайте, что ваш контент должен храниться в каталоге content/.

Шаг 3: Установите темы из репозитория Hugo

Чтобы установить все темы из репозитория Hugo, выполните следующие команды. Они создадут каталог с именем themes/в каталоге вашего сайта и загрузят все темы из репозитория Hugo.

cd ~/mysite/
git clone --depth 1 --recursive https://github.com/spf13/hugoThemes.git themes

Если вы просто хотите установить одну тему, посетите репозиторий Hugo, чтобы определить свою любимую тему. Скопируйте его URL и вставьте его в git cloneкоманду ниже.

cd ~/mysite/
mkdir themes
cd themes
git clone https://github.com/jaden/twentyfourteen

Шаг 4: внесите некоторые основные изменения в конфигурацию

Файл с именем config.tomlв каталоге вашего сайта содержит глобальную конфигурацию вашего сайта Hugo. Отредактируйте файл с помощью текстового редактора, чтобы внести некоторые основные изменения в конфигурацию, как указано ниже. Не забудьте заменить значения в соответствии с вашими конкретными условиями.

baseurl = "http://[YourSiteIP]/"
languageCode = "en-us"
title = "Your Site Name"
theme = "twentyfourteen"

Шаг 5. Создайте свой контент

В каталоге вашего сайта введите следующую команду, чтобы создать страницу содержимого в каталоге ~/mysite/content/post/.

cd ~/mysite/
hugo new post/about.md

Откройте файл в текстовом редакторе, формат файла должен выглядеть следующим образом.

+++
date = "2015-12-25T03:21:23Z"
draft = true
title = "about"

+++

Между двумя строками +++лежит мета-информация о вашей контентной странице. Здесь вы можете удалить строку draft = trueи изменить строку заголовка по своему желанию.

Под второй +++строкой добавьте контент, который вы хотите отобразить на веб-странице. Не забудьте написать свой контент на языке разметки.

## This is an H2 headline

Text goes here.

После завершения редактирования оставьте текстовый редактор открытым для дальнейшего использования.

Шаг 6. Настройте контент с помощью сервера Hugo.

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

Откройте другой терминал, настройте iptablesправила, чтобы разрешить доступ к вашему сайту через порт 1313 по умолчанию на сервере Hugo:

sudo iptables -I INPUT -p tcp --dport 1313 -j ACCEPT

Запустите сервер Hugo:

hugo server --bind="[YourServerIP]"

Посетите ваш сайт из браузера:

http://[YourServerIP]:1313

Теперь вы можете попробовать отредактировать содержимое файла подкачки в предыдущем терминале или добавить / удалить файл подкачки. Вы обнаружите, что любые изменения в content/каталоге будут отражены одновременно на экране вашего браузера. Это отличная возможность для занятого блоггера, потому что вы всегда можете сразу увидеть свои модификации для лучшего сочинения.

После завершения редактирования нажмите, Ctrl+Cчтобы остановить сервер Hugo.

Шаг 7: опубликуйте свой сайт

Теперь пришло время опубликовать ваш сайт в Интернете. Запустите следующие команды, и Hugo сгенерирует весь статический контент, подходящий для публикации в public/каталоге.

cd ~/mysite
hugo

Примечание : Hugo не будет удалять старые файлы, которые были сгенерированы ранее, когда вы запускаете команды выше. Чтобы избежать неожиданных результатов, вы всегда можете удалить public/каталог перед запуском hugoкоманды или указать новое место назначения вывода, как показано в следующей команде.

hugo --destination=public2

Поскольку веб-сервер Nginx уже запущен на сервере, все, что вам нужно сделать, это скопировать содержимое ~/mysite/public/каталога или других пользовательских каталогов назначения в ваш веб-каталог /usr/share/nginx/html/.

Удалить исходные файлы:

cd /usr/share/nginx/html/
sudo rm -rf background.jpg index.php logo.png

Скопируйте файлы статического сайта в веб-каталог:

cd ~/mysite/public
sudo cp -R ~/mysite/public/. /usr/share/nginx/html/

Вот и все. Теперь вы можете посетить ваш супер быстрый статический сайт из вашего браузера: http://[YourServerIP].

Чтобы увидеть более подробную информацию, используйте команду hugo helpили посетите официальный сайт Hugo .