Хьюго Тема Квинт

Квинт: Суть минимализма

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

Ознакомьтесь с репозиторием демонстрационного сайта, который вы также можете использовать в качестве стартового шаблона для нового сайта. (Тсс... там есть кнопка развертывания в Netlify одним щелчком мыши.)

Живая демо-версия здесь.

Функции

• Минималистичный дизайн : ориентирован на читабельность контента с минимальными отвлекающими факторами.

• Темный и светлый режимы : автоматическое переключение тем с учетом настроек браузера/устройства зрителя.

• Адаптивный макет : отлично смотрится как на мобильных, так и на настольных устройствах.

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

• Поиск по сайту : встроенный поиск на вашем статическом сайте с использованием Lunr.js.

• Социальные значки : настраиваемые ссылки на ваши социальные сети в нижнем колонтитуле.

Быстрый старт

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

Пошаговое руководство по созданию нового сайта с помощью Hugo можно найти в Кратком руководстве.

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

Установив Hugo, добавьте Quint в каталог тем вашего сайта. Из корня вашего сайта запустите:

 Подмодуль git добавить https://github.com/victoriadrake/hugo-theme-quint.git themes/quint

Шаг 2. Добавьте тему в свою конфигурацию

Откройте файл конфигурации вашего сайта Hugo ( hugo.toml , hugo.yaml или hugo.json ) и обновите параметр theme , чтобы использовать quint :

hugo.toml :

 тема = "квинта"

hugo.yaml :

 тема: «Квинта»

Шаг 3. Настройте

Квинт выглядит великолепно «из коробки». При желании скопируйте значения конфигурации из yoursite/themes/quint/hugo.toml в конфигурацию вашего сайта ( yoursite/hugo.toml ), чтобы дополнительно персонализировать Quint.

Шаг 4. Запустите сервер

Запустите Hugo, чтобы создать сайт и запустить сервер. Из корня вашего сайта запустите:

 сервер Хьюго

Перейдите по адресу http://localhost:1313 в своем веб-браузере, чтобы увидеть, как ваш сайт работает с темой Quint.

Получать обновления

Чтобы загрузить последнюю версию Quint, запустите:

 Обновление подмодуля git --remote themes/quint

Настройка

Quint прост в настройке.

CSS

Легко добавляйте свои собственные файлы CSS, назвав их в конфигурации Hugo:

 [params]css = ["css/custom.css"] # Ваши пользовательские переопределения CSS, хранящиеся в yoursite/static/

Макеты

Вы можете переопределить любой макет, используя файл с тем же именем в каталоге вашего проекта. Например, файл yoursite/layouts/partials/contact.html переопределит yoursite/themes/quint/layouts/partials/contact.html .

Добавьте или удалите разделы с домашней страницы, переопределив файл yoursite/themes/quint/layouts/index.html . Просто создайте копию этого файла в каталоге вашего проекта ( yoursite/layouts/index.html ) и удалите или добавьте любые partial файлы по вашему желанию.

Графические баннеры

Если на странице или в сообщении не указано image в начале, Quint отобразит красивый баннер с изображением, выбрав случайное изображение из каталога themes/quint/static/images .

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

 [params]numImages = 12 # Количество случайных изображений на выбор для баннеров (в темах/quint/static/images)

Содействие

Вклады в Quint приветствуются! Не стесняйтесь отправлять сообщения о проблемах или запросы на включение на GitHub, чтобы улучшить функциональность темы или улучшить документацию.

Хотите несколько идей для начала? Вот краткий список функций, которые я хотел бы видеть добавленными:

• Кнопки копирования блока кода

• Подсветка синтаксиса Hugo's Chroma

• Генератор активов Хьюго с конвейеризацией, снятием отпечатков пальцев, объединением и минимизацией

• Многоязычная поддержка

• Хлебная навигация

Лицензия

Эта тема выпущена под лицензией MIT. Более подробную информацию смотрите в файле LICENSE.

Атрибуция

• Quint использует превосходный шрифт Open Sauce.

• Макет устройства, созданный на сайте deviceframes.com.