Сначала перейдите в {% label default@GitHub%}, чтобы загрузить исходный код и сохранить папку index.html, js и css Мой блог основан на HEXO, поэтому сохраните приведенный выше файл файла в папке «корень блога \ источник \ «Новый себе». (Вы можете поместить его в любую папку во время отладки)

Изменение индекса .html

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

{% label info@line 4: %} Название страницы - это то, что выглядит глупо на метке.

{% label info@line 9:%}, вы можете установить его для своих нужд.

{% label info@line 12: %} Ваш скрипт Google Analytics для записи посещений.

{% label info@line 44:%} Скрипт, который автоматически воспроизводит музыку, вы можете скопировать меня напрямую, а затем изменить среднюю ссылку на нужную музыку.

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

Изменение CSS

Файл в CSS/стиле, .css потому, что разработчик не спрашивал никакого разрешения, а информация в левом верхнем углу не очень красивая, поэтому я все это удалил.

{% label default@quotes article%} — размер тела, {% label default@quotes статье em%} — размер серого отпечатка, {% label default@quotes статье em:before%} Символ перед серым принтом определен ниже, вы можете использовать все, что захотите. Вот что я использую:

'''css * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; размер коробки: бордюр-коробка; }

html, body { семейство шрифтов: Nsimsun, Consolas, моноширинный; Предыстория: #f2f2f2; набивка: 0; маржа: 0; }

.quotes { позиция: абсолютная; внизу: 0px; ширина: 100%; слева: 0; вверху: 0px; }

.quotes статья { border-bottom: 2px пунктирные #ddd; выравнивание текста: выравнивание по ширине; высота линии: 1,5; Предыстория: #fff; max-width: 900px; размер шрифта: 24px; толщина шрифта: полужирный; отступы: 60 x 30 пикселей; маржа: 0 авто; ширина: 100%; цвет: #333; }

.quotes статья em { стиль шрифта: Microsoft YaHei; размер шрифта: 16px; цвет: #666; }

.quotes статья em:before { содержание: '-'; поля: 0 10px; }

### Изменить js

.js foldscroll.min и foldscroll в папке .js анимационных эффектов, и их не нужно перемещать (я, конечно, не могу его изменить, если у вас большой бог, вы можете сделать это самостоятельно). Кавычки .js содержит весь текст на странице, вы можете добавить свой любимый текст, но вы должны изменить его в соответствии с исходным форматом страницы, иначе он пойдет не так.

## Развертывание

<div class="note info"> После того, <p>как вышеуказанные шаги будут выполнены, вы можете нажать на индекс локально.html вы можете просмотреть свой измененный эффект. Далее следует развертывание в HEXO. </p></div>

### Добавление пунктов меню

Я использую следующую тему, поэтому файл конфигурации находится в «корневом каталоге блога\themes\next\_config.yml», и мне нужно настроить параметры меню слева направо, {% метка success@name%}, {% метка success@link%}, {%метка success@ разделитель%}, {%метка success@icon%}. Я добавил запись «Журнал». 

'''css
меню:
  Главная: / || дом
  Теги: /tags/ || Теги
  Категории: /categories/ || Й
  Архивы: /archives/ || архив
  Журнал: /log || Календарь #新增加的
  #sitemap: /sitemap.xml || Карта сайта
  #commonweal: /404/ || сердцебиение
  #about: /about/ || пользователь

Исключение папок

Потому что HEXO визуализирует файл MD как HTML-файл во время развертывания, но моя страница была установлена, и она будет искажена при повторном рендеринге, поэтому мне нужно исключить всю эту папку.

Конфигурационный файл находится в 'blog root_config.yml', найдите skip_render: Добавьте папки, которые вы хотите исключить после него, помня, что после двоеточия стоит пробел (не спрашивайте меня, откуда я знаю 🙃. Пример:

'''css skip_render: 'log/**' ```

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