Демо-сайт | Журнал изменений
Yue — это минималистичная, многоязычная и настраиваемая тема Hugo, подходящая для ведения блогов.
Скриншоты могут быть устаревшими, поэтому лучше посетить демо-сайт.
Светлый режим на рабочем столе
Тёмный режим на рабочем столе
Легкий режим на мобильном телефоне
Тёмный режим на мобильном телефоне
Минимальный внешний вид
Простота установки (с установленными Git и Hugo создайте веб-сайт за несколько секунд)
Подробная документация
Автоматический темный режим
Многоязычный
Список переводов на одной странице
Выбор языка (перейти на соответствующую страницу или домашнюю страницу)
Несколько авторов
Оглавление (складное, создается только при наличии)
Дата изменения на главной странице, отдельной странице, странице раздела и странице термина.
Пользовательский формат даты
Пагинация на главной странице и странице раздела
Полнотекстовый RSS-канал
Теги и категории
Уведомление об авторских правах (можно указать автора и год)
RSS-ссылка
Заголовок анкорной ссылки
Мобильный и отзывчивый
СКСС
Поисковая оптимизация
Микроданные
мета-описание
Открыть график
Количество страниц в разделах ( /posts/ , /tags/ и т. д.)
Кастомизация
Фавикон
Стили (СКСС)
Содержание (HTML)
Чтобы узнать обо всех функциях, проверьте Hugo.yaml (конфигурация по умолчанию) и exampleSite/hugo.yaml (конфигурация демонстрационного сайта).
Установите Git и последнюю расширенную версию Hugo.
# Создать веб-сайтgit init my-websitecd my-website# Установить подмодуль themegit add --length=1 https://github.com/CyrusYip/hugo-theme-yue themes/hugo-theme-yue git commit --message "добавить тему"# Создать демонстрационную версию contentcp --recursive themes/hugo-theme-yue/exampleSite/* .# Previewhugo server
Теперь у нас есть работающий демо-сайт. Каталог content содержит содержимое, hugo.yaml — это файл конфигурации. Не стесняйтесь играть с ними.
компакт-диск мой веб-сайт Обновление подмодуля git --remote
Перед обновлением темы рекомендуется прочитать CHANGELOG.md.
Вы можете подписаться на обновления и журнал изменений в агрегаторе каналов (например, Inoreader).
Обновления: https://github.com/CyrusYip/hugo-theme-yue/commits/main.atom.
Журнал изменений: https://github.com/CyrusYip/hugo-theme-yue/commits/main/CHANGELOG.md.atom
Вам необходимо использовать дополнительные параметры при клонировании проекта вашего веб-сайта.
git clone --recurse-submodules --shallow-submodules [email protected]:ваше-имя-пользователя/мой-сайт.git
После настройки веб-сайта вы, вероятно, захотите разместить его в Интернете. Есть много способов сделать это, см. Хостинг и развертывание | Хьюго. Если вы не знаете, что выбрать, вы можете начать с Netlify, см. Хост на Netlify | Хьюго.
Обязательно измените baseURL на свое доменное имя (например, https://my-cool-domain.org/ ) hugo.yaml .
-baseURL: https://yue.cyrusyip.org/+baseURL: https://my-cool-domain.org/
Рекомендуемая команда сборки:
Хьюго --gc --minify
--gc удалить неиспользуемые файлы кэша и --minify уменьшить размер веб-сайта (в основном HTML).
Создайте новый пост.
hugo new content content/en/posts/my-first-post.md
Чтобы узнать больше об использовании, см.:
Основное использование | Хьюго
Структура каталогов | Хьюго
Настройки перечислены в exampleSite/hugo.yaml (конфигурация демонстрационного сайта) иhugo.yaml (конфигурация по умолчанию, импортированная первым).
hugo.yaml находится в корне проекта вашего веб-сайта и представляет собой файл конфигурации, который является копией exampleSite/hugo.yaml.
Чтобы узнать конфигурацию, см. Настройка Hugo | Хьюго.
Поддерживаемые языки:
en : английский
fr : французский
zh-CN : упрощенный китайский
Чтобы создать многоязычный веб-сайт, см. Многоязычный режим | Хьюго и exampleSite/hugo.yaml.
Файлы перевода расположены в каталоге i18n и data/i18n.yaml. Приветствуются вклады в поддержку дополнительных языков.
Чтобы добавить новый язык:
Создайте языковой файл (например, fr.yaml для французского языка) в каталоге i18n.
Скопируйте содержимое i18n/en.yaml в новый файл.
Удалите все комментарии ( # ... ) и переведите контент.
Также переведите содержимое data/i18n.yaml.
Если вы хотите продолжать вносить свой вклад в перевод, вы можете получать последние изменения, подписавшись на канал i18n/en.yaml (https://github.com/CyrusYip/hugo-theme-yue/commits/main/i18n/en.yaml). .atom) с помощью программы чтения RSS.
Если ваш веб-сайт не на английском языке, вы, вероятно, захотите настроить заголовок /tags и /categories .
Например, чтобы настроить заголовок /tags веб-сайта zh-CN , создайте content/zh-CN/tags/_index.md и добавьте в файл следующий контент.
--- title: Chinese Tags ---
Yue позволяет настраивать значок, стили (SCSS) и содержимое (HTML).
Фавикон — это значок рядом с заголовком на вкладке браузера. Чтобы использовать свой значок, поместите favicon.ico в static каталог. Вы можете создать favicon.ico с помощью онлайн-генераторов favicon.ico.
Юэ использует SCSS (libsass) для добавления стилей. Все файлы находятся в assets/scss. Чтобы настроить стили, создайте assets/scss/_style-start.scss и assets/scss/_style-end.scss .
_style-start.scss применяется первым, и вы можете переопределить переменные в этом файле.
$base-font-size: 15 пикселей;
_style-end.scss применяется последним, и в этот файл можно добавлять стили.
Ванильный CSS также допустим в SCSS.
Ссылки:
CSS: каскадные таблицы стилей | МДН
Sass: основы Sass
Структура каталогов | Хьюго
Вы можете создать эти файлы для вставки HTML-кода.
layouts/partials/head/head-start.html
layouts/partials/head/head-end.html
layouts/partials/single/single-end.html
layouts/partials/body/body-end.html
head-start.html добавляется в начало элемента <head> .
Варианты использования:
Предварительная загрузка скриптов
Загрузить скрипты
Загрузить стили
Вот пример предварительной загрузки скриптов:
<link rel="preload" as="script" href="https://unpkg.com/@swup/head-plugin@2"><link rel="preload" as="script" href="https: //unpkg.com/@swup/preload-plugin@3"><link rel="preload" as="script" href="https://unpkg.com/swup@4">
head-end.html добавляется в конец элемента <head> .
Варианты использования:
Загрузить скрипты
Загрузить стили
Вот пример добавления Google Analytics и локального скрипта:
<!-- Google Analytics --><script async src="https://www.googletagmanager.com/gtag/js?id=G-F46B15BRUF"></script><script> window.dataLayer = window.dataLayer || []; функция gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-F46B15BRUF');</script><!-- Локальный скрипт, путь: assets/js/my-script.js -->{{ with resources.Get "js/my-script .js" | js.Build }} <script defer src="{{ .RelPermalink }}"></script>{{ end }} single-end.html добавляется в конец элемента <main> в сообщении.
Варианты использования:
сервисы комментариев, например Disqus и giscus
Вот пример добавления Giscus:
{{ $language := "" }}
{{- /*
Обходной путь для языкового префикса нижнего регистра,
см. https://github.com/gohugoio/hugo/issues/9404.
*/ -}}
{{ if eq site.LanguagePrefix "/zh-cn" }}
{{ $language = "zh-CN" }}
{{ еще }}
{{ $language = "ru" }}
{{ end }}<script src="https://giscus.app/client.js" data-repo="CyrusYip/yue-test" data-repo-id="P_9hJMbXtqr" data-category="Общие" данные -category-id="SIB_ldsflk712ldRsjf7" data-mapping="pathname" data-strict="0" data-reactions-enabled="1" data-emit-metadata="0" data-input-position="bottom" data-theme="preferred_color_scheme" data-lang="{{ $language }}" crossorigin="anonymous " асинхронный></script>Список сервисов комментариев: Комментарии | Хьюго.
body-end.html добавляется в конец элемента <body> .
Варианты использования:
Динамически загружать скрипты
Чтобы сообщить об ошибках, отправьте проблему. Чтобы задать вопросы, начните обсуждение.
Hugo имеет множество функций. Чтобы узнать больше, прочтите документацию Hugo.
См. CHANGELOG.md.
Этот проект используетhugo-bin - npm для управления версией Hugo. Предварительное условие: Node.js и npm.
Клонируйте этот репозиторий.
установка npm npm запустить чисто: сервер: общий
В package.json перечислены и другие полезные команды. Чтобы использовать рекомендованную версию Hugo, запустите npx hugo .
Если у вас не установлены Node.js и npm, просто установите версию, указанную в package.json.
"hugo-bin": { "buildTags": "extended", "version": "x.yyy.z"},CHANGELOG.md должен обновляться при каждом коммите.
Если вы используете Yue и исходный код вашего веб-сайта размещен на GitHub, вы можете добавить тему hugo-theme-yue в свой репозиторий.
Ссылка на тему hugo-theme-yue .
Я многому научился на многих проектах. Спасибо, разработчики.
hugo-xmin (минимальные шаблоны)
Хьюго-Тема-Джейн (шаблон RSS)
Hugo-theme-zen (выбор языка)
Хьюго-тема-gruvbox (цвет)
грувбокс (цвет)
hugo-theme-stack (исходный код, документация и конфигурация)
Hugo-PaperMod (исходный код, документация и конфигурация)
Этот проект имеет лицензию MIT.
