Эта тема является обновленной версией темы мечты Юэ Ян и содержит тонны новых функций, таких как:
Эта тема может быть использована для двух целей:
Этот проект придерживается Кодекса поведения завета участника. Участвуя, вы должны поддержать этот кодекс. Пожалуйста, сообщите о неприемлемом поведении [email protected].
Установка
Начиная
Документация
Почти закончил
Внося
Лицензия
Тема может быть установлена, запустив следующие команды в папке веб -сайта Hugo .
cd themes
git submodule add https://github.com/UtkarshVerma/hugo-dream-plus dream-plus
git submodule update --init --recursiveКак только тема будет успешно установлена, вам придется немного настройка темы, чтобы встретить ваш вкус.
В папке exampleSite вы найдете файлы конфигурации, cards.toml posts.toml
Вы должны использовать эти файлы конфигурации в качестве основы для вашего сайта, поскольку они заботятся о необходимых объявлениях переменных , которые вы можете редактировать в соответствии с вашими потребностями.
Определите себя через следующие переменные конфигурации в params в рамках таблицы author , как показано:
[ params . author ]
author = " <name of the author> "
description = " Short description of the site "
motto = " author's motto or short description "
# Leaving the avatar variable unset displays svg avatars
avatar = " <absolute path to avatar> "После этого заполните социальные переменные в конце файла конфигурации. Эта тема подчиняет следующие социальные сайты: (приведены примеры)
| Социальная ссылка | Переменная | Пример инициализации |
|---|---|---|
| GitHub | GitHub | github = "username" |
| Электронная почта | электронная почта | email = "[email protected]" |
twitter = "username" | ||
facebook = "username" | ||
| YouTube | YouTube | youtube = "username" |
| Середина | середина | medium = "username" |
linkedin = "username" | ||
| Stackoverflow | Stackoverflow | stackoverflow = "number/username" |
| Кодепен | Кодепен | codepen = "username" |
reddit = "username" |
Эти переменные должны быть в [social] таблице config.toml или ее эквивалента YAML или JSON .
[ social ]
github = " UtkarshVerma "Как только это будет сделано, напишите раздел « О меня » на вашем веб -сайте на Markdown, как указано здесь: Ошибка и о страницах.
Как указывалось ранее, эта тема имеет два просмотра, представление карт и представление постов . Тип вида рендеринга зависит от типа контента, который вы кормите, чтобы Dream Plus . Поэтому:
cards в папке /content активирует представление карты .posts в папке /content активирует представление пост .Переменная
contentTypeтеперь устарела.
Одним из явных различий между обоими представлениями является то, что представление карты не поддерживает посты, вместо этого он перенаправляет на указанную ссылку, в то время как Post View делает. Вы можете проверить их сами, посетив мои сайты (указанные выше), которые используют их. Кроме того, создание пост/карты выполняется по -разному для обоих представлений. Это следующее:
hugo new cards/example.md # Card creation
hugo new posts/example.md # Post creationПосле этого просто откройте свою карту Markdown Card/Post и предоставьте параметры для карты/поста.
Есть два разных способа настройки фона этой темы. Эти настройки взаимоисключают друг друга.
Чтобы установить определенный цвет фона, сделайте это с помощью color переменной. Если вы хотите установить случайную комбинацию цветов в качестве фона, просто оставьте цветную переменную Unset .
[ params . background ]
color = " #13547A " # Provide a color as hex or rgb equivalent Укажите изображение, которое вы хотите установить в качестве фона через массив images . Если вы предпочитаете один фон изображения, просто дайте одно значение для массива. Например:
[ params . background ]
images = [ " /images/bg1.jpeg " ] # Single image as background
images = [ " /images/bg1.jpeg " , " <some other image> " ] # Multiple images as background Предоставление нескольких изображений для массива images позволяет случайной фон изображений Dream Plus, которая циклирует фон в данном массиве каждый раз, когда сайт перезагружается. Вы также можете размыть фон в определенной степени через переменную blur .
Все переменные
paramsсфигурирующиеbackround
[ params . background ]
# Random backgrounds
images = [ " /images/bg1.jpeg " , " /images/bg2.jpeg " , " /images/bg3.jpeg " ]
# Blur the background
blur = " 0.2 "Обложки для каждой пост-карты или карты обрабатываются Dream Plus с использованием обработки изображений Hugo для более быстрого времени загрузки веб-сайта. Пути поиска файла обложки, как указано ниже:
/content/cards/<card>/cover.<any-extension>/content/posts/<post>/images/cover.<any-extension>
Указание изображения крышки через переднюю передачу теперь устарелоПолем Крышки карты теперь могут быть определены через переднюю передачу через ключcover. Однако обработка изображений не будет применима на таких обложках. Кроме того, передние обложки приоритет в ресурсах изображений , поэтому, чтобы сделать крышки ресурсов изображения рендеринг, вам придется сначала удалить клавишу крышки с передней панели.
Вы также можете изменить процесс обработки изображений через переменную coverArgs в [params.features] . Аргументы, передаваемые, должны быть для функции .Resize поскольку это то, что Dream Plus использует. Например,
[ params . features ]
coverArgs = " 400x300 q50 " # Specify resolution and quality of output image Вы можете настроить свой веб -сайт на основе клиентского устройства, используя переменную isMobile JS. Это true , когда клиентское устройство является мобильным и наоборот.
Эта тема поддерживает общую настройку страниц по поводу и ошибок . Эти страницы могут быть настроены через файлы about.md и 404.md Dream Plus читает приведенные выше файлы в виде простого текста разметки , а затем их отображает. Как только вы закончите писать файлы и изменить их в соответствии с вашими потребностями, вставьте их в папку content вашего сайта Hugo. Если вы не хотите, чтобы эти страницы были построены Hugo и обслуживали свои собственные ссылки, такие как <website>.<domain>/about или <website>.<domain>/404 . Затем вы можете сказать Хьюго игнорировать их через переменную ignoreFiles в вашем файле config.toml следующим образом:
ignoreFiles = [ " content/404.md " , " content/about.md " ] Вы также можете установить пользовательский Favicon для вашего веб -сайта через переменную конфигурации favicon по params . Например,
[params]
favicon = "/images/defaultFav.ico"
Сценарий Short.St веб -сайта был реализован в этой теме. Чтобы использовать его, вам придется настроить его через самую shortest таблицу под params .
[ params . shortest ]
enabled = true # Enable shorte.st
apiToken = " " # The API Token you received from shorte.st
domains = [ " " ] # The domains you want to define Если вы хотите контролировать количество сообщений/карт, которые есть на странице, то вы можете сделать это, используя ловушку для paginate .
paginate = 4 # Defaults to 10 Кроме того, теги при включении не будут отображаться на заголовке и боковой панели по умолчанию. Там отображаются только 8 лучших тегов (с точки зрения статьи), чтобы избежать скопления. Однако его можно переопределить, используя переменную tagLimit таблицы [params.tag] .
[ params . tag ]
enabled = true
tagLimit = 10 # Top 10 tags will be displayed
# or
tagLimit = 0 # Display all tagsЕсть и другие незначительные конфигурации. Вы можете настроить их, ссылаясь на комментарии внутри файла конфигурации.
Документация для этого репозитория в настоящее время находится под работе и добавляется в вики этого хранилища. Взносы вики наиболее приветствуются. Не стесняйтесь спрашивать меня об особенностях этой темы.
После завершения конфигураций вы готовы идти. Итак, протестируйте свой сайт, используя:
hugo serverВаш сайт теперь должен быть локально доступен по адресу http: // localhost: 1313 для целей тестирования.
Для тестирования примера сайта вам придется явно указать файл конфигурации в Hugo. Это сделано следующим образом:
# For posts view demo
hugo server --config posts.toml
# For cards view demo
hugo server --config cards.tomlНашел что -нибудь интересное, чтобы добавить к этой теме, или, скорее, ошибку? Дайте мне знать об этом через трекер выпуска. Приглашенные запросы также приветствуются. Для получения более подробных инструкций о том, как внести свой вклад, см.
Эта тема выпущена по лицензии MIT .