312 words

2 mins

Расширенная настройка Twilight

Guide for Template - Advanced Customization

2024-02-10

Guides

Advanced Customization

Twilight

Astro

Customization

Series tags: Twilight

Astro

Guide

Серии: Руководство по шаблону Twilight

Уведомление о переводе (Не проверено)

Эта страница переведена ИИ и может содержать неточности.

Переведено с: 🇬🇧 English （Deepseek）

Посмотреть оригинал Вернуться к переводу

Это руководство охватывает расширенные возможности настройки и функции, доступные в шаблоне Twilight, от глобальных конфигураций до специализированных расширений Markdown.

Глобальная конфигурация

Файл twilight.config.yaml является сердцем конфигурации вашего блога. Вот некоторые расширенные настройки, которые вы можете изменить:

Сайт и локализация

Язык и перевод: Включите перевод на стороне клиента с помощью site.translate.enable. Вы можете выбрать различные сервисы и настроить автоматическое определение.
Пользовательские шрифты: Добавьте свои собственные шрифты, указав CSS-ссылку или путь к файлу в site.font.

Визуальные эффекты

Цвет темы: Измените основной цвет вашего блога, настроив site.themeColor.hue (0-360).
Режимы обоев: Выберите между banner, fullscreen или none. Вы также можете включить carousel для нескольких обоев с эффектом kenBurns.
Эффект волн: Включите анимированный эффект водной ряби на баннере с помощью site.wallpaper.banner.waves.enable.
Эффекты частиц: Включите плавающие частицы на фоне с помощью particle.enable.

Пользовательский интерфейс

Прозрачность панели навигации: Настройте site.wallpaper.banner.navbar.transparentMode между semi, full или semifull.
Виджеты боковой панели: Измените порядок или включите/отключите компоненты боковой панели, такие как profile, announcement, categories, tags, toc и statistics в sidebar.components.

Расширения Markdown

Карточки репозиториев GitHub

Вы можете добавлять динамические карточки, которые ссылаются на репозитории GitHub. При загрузке страницы информация о репозитории извлекается из GitHub API.

Spr-Aachen

Twilight

Waiting for api.github.com...

00K

Waiting...

Создайте карточку репозитория GitHub с помощью кода ::github{repo="Spr-Aachen/Twilight"}.

1
::github{repo="Spr-Aachen/Twilight"}

Музыкальные карточки

Онлайн

Loading lyrics...

0:00 / 0:00

1
::music{meting="https://meting.spr-aachen.com/api?server=netease&type=song&id=1390882521"}

Локальные

深海之息

Youzee Music

Loading lyrics...

0:00 / 0:00

1
::music{title="深海之息" artist="Youzee Music" cover="https://p1.music.126.net/PhKOqFtljgHDDpKYM2ADUA==/109951169858309716.jpg" audio="assets/music/深海之息.m4a" lrc="assets/music/深海之息.lrc"}

Адмонишены (Предупреждения)

Поддерживаются следующие типы адмонишенов: note tip important warning caution

Note
Выделяет информацию, которую пользователи должны принять во внимание, даже при беглом просмотре.

Tip
Дополнительная информация, помогающая пользователю добиться большего успеха.

Important
Ключевая информация, необходимая пользователям для достижения успеха.

Warning
Критический контент, требующий немедленного внимания пользователя из-за потенциальных рисков.

Caution
Возможные негативные последствия действия.

Базовый синтаксис

1
:::note
2
Выделяет информацию, которую пользователи должны принять во внимание, даже при беглом просмотре.
3
:::
4

5
:::tip
6
Дополнительная информация, помогающая пользователю добиться большего успеха.
7
:::

Пользовательские заголовки

Заголовок адмонишена можно настроить.

МОЙ ПОЛЬЗОВАТЕЛЬСКИЙ ЗАГОЛОВОК
Это заметка с пользовательским заголовком.
```
1
:::note[МОЙ ПОЛЬЗОВАТЕЛЬСКИЙ ЗАГОЛОВОК]
2
Это заметка с пользовательским заголовком.
3
:::
```
Синтаксис GitHub

Tip
Синтаксис GitHub также поддерживается.
```
1
> [!TIP]
2
> Синтаксис GitHub также поддерживается.
```
Спойлер

Вы можете добавлять спойлеры в свой текст. Текст также поддерживает синтаксис Markdown.

Содержимое скрыто aййй!
```
1
Содержимое :spoiler[скрыто **aййй**]!
```

Для получения более подробной информации обратитесь к Документации.

This guide covers advanced customization options and features available in the Twilight template, from global configurations to specialized Markdown extensions.

Global Configuration

The twilight.config.yaml file is the heart of your blog’s configuration. Here are some advanced settings you can tweak:

Site & Localization

Language & Translation: Enable client-side translation using site.translate.enable. You can choose different services and configure auto-detection.
Custom Fonts: Add your own fonts by providing a CSS link or file path under site.font.

Visual Effects

Theme Color: Change the primary color of your blog by adjusting the site.themeColor.hue (0-360).
Wallpaper Modes: Choose between banner, fullscreen, or none. You can also enable a carousel for multiple wallpapers with the kenBurns effect.
Waves Effect: Toggle the animated water ripple effect on the banner using site.wallpaper.banner.waves.enable.
Particle Effects: Enable floating particles in the background with particle.enable.

UI

Navbar Transparency: Adjust site.wallpaper.banner.navbar.transparentMode between semi, full, or semifull.
Sidebar Widgets: Reorder or toggle sidebar components like profile, announcement, categories, tags, toc, and statistics in sidebar.components.

Markdown Extensions

GitHub Repository Cards

You can add dynamic cards that link to GitHub repositories, on page load, the repository information is pulled from the GitHub API.

Spr-Aachen

Twilight

Waiting for api.github.com...

00K

Waiting...

Create a GitHub repository card with the code ::github{repo="Spr-Aachen/Twilight"}.

1
::github{repo="Spr-Aachen/Twilight"}

Music Cards

Online

Loading lyrics...

0:00 / 0:00

1
::music{meting="https://meting.spr-aachen.com/api?server=netease&type=song&id=1390882521"}

Local

深海之息

Youzee Music

Loading lyrics...

0:00 / 0:00

1
::music{title="深海之息" artist="Youzee Music" cover="https://p1.music.126.net/PhKOqFtljgHDDpKYM2ADUA==/109951169858309716.jpg" audio="assets/music/深海之息.m4a" lrc="assets/music/深海之息.lrc"}

Admonitions

Following types of admonitions are supported: note tip important warning caution

Note
Highlights information that users should take into account, even when skimming.

Tip
Optional information to help a user be more successful.

Important
Crucial information necessary for users to succeed.

Warning
Critical content demanding immediate user attention due to potential risks.

Caution
Negative potential consequences of an action.

Basic Syntax

1
:::note
2
Highlights information that users should take into account, even when skimming.
3
:::
4

5
:::tip
6
Optional information to help a user be more successful.
7
:::

Custom Titles

The title of the admonition can be customized.

MY CUSTOM TITLE
This is a note with a custom title.
```
1
:::note[MY CUSTOM TITLE]
2
This is a note with a custom title.
3
:::
```
GitHub Syntax

Tip
The GitHub syntax is also supported.
```
1
> [!TIP]
2
> The GitHub syntax is also supported.
```
Spoiler

You can add spoilers to your text. The text also supports Markdown syntax.

The content is hidden ayyy!
```
1
The content :spoiler[is hidden **ayyy**]!
```

For more details, check the Documentation.

Расширенная настройка Twilight

/ru-RU/posts/twilight-guide-advanced-customization/

Author

MuxBuffer

Published at

2024-02-10

License

CC BY-NC-SA 4.0

Индекс участия ИИ IIIA-0

Категория Без ИИ

Уровень 0

Описание ИИ не использовался вовсе

This page may not be the latest version.