LOADING
613 字
3 分钟

暮光指南:進階自訂

Guide for Template - Advanced Customization

翻譯提示 (未審閱)

此頁面由 AI 翻譯生成,可能存在不準確之處。

翻譯自: 🇬🇧 English (Deepseek)

檢視原文 回到譯文

本指南涵蓋 Twilight 模板中可用的進階自訂選項與功能,從全域設定到專門的 Markdown 擴充功能。

全域設定

twilight.config.yaml 檔案是您部落格設定的核心。以下是一些您可以調整的進階設定:

網站與在地化

  • 語言與翻譯:使用 site.translate.enable 啟用客戶端翻譯。您可以選擇不同的服務並設定自動偵測。

  • 自訂字型:透過在 site.font 下提供 CSS 連結或檔案路徑來新增您自己的字型。

視覺效果

  • 主題顏色:調整 site.themeColor.hue(0-360)來變更部落格的主要顏色。

  • 桌布模式:選擇 bannerfullscreennone。您也可以啟用 carousel 來輪播多張桌布,並搭配 kenBurns 效果。

  • 波浪效果:使用 site.wallpaper.banner.waves.enable 切換橫幅上的動態水波漣漪效果。

  • 粒子效果:使用 particle.enable 啟用背景中的浮動粒子。

使用者介面

  • 導覽列透明度:將 site.wallpaper.banner.navbar.transparentMode 調整為 semifullsemifull

  • 側邊欄小工具:在 sidebar.components 中重新排序或切換側邊欄元件,例如 profileannouncementcategoriestagstocstatistics

Markdown 擴充功能

GitHub 儲存庫卡片

您可以新增連結到 GitHub 儲存庫的動態卡片,在頁面載入時,會從 GitHub API 擷取儲存庫資訊。

Spr-Aachen
/
Twilight
Waiting for api.github.com...
00K
0K
0K
Waiting...

使用程式碼 ::github{repo="Spr-Aachen/Twilight"} 建立一個 GitHub 儲存庫卡片。

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

音樂卡片

  • 線上
Loading...
Loading...
Loading lyrics...
0:00 / 0:00
::music{meting="https://meting.spr-aachen.com/api?server=netease&type=song&id=1390882521"}
  • 本地
深海之息
Youzee Music
Loading lyrics...
0:00 / 0:00
::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

某個行動可能導致的負面後果。

  • 基本語法

    :::note
    Highlights information that users should take into account, even when skimming.
    :::
    :::tip
    Optional information to help a user be more successful.
    :::
  • 自訂標題

    可以自訂提示區塊的標題。

    我的自訂標題

    這是一個帶有自訂標題的筆記。

    :::note[我的自訂標題]
    這是一個帶有自訂標題的筆記。
    :::
  • GitHub 語法

    Tip

    GitHub 語法 也受支援。

    > [!TIP]
    > GitHub 語法也受支援。
  • 劇透

    您可以在文字中加入劇透。文字也支援 Markdown 語法。

    這個內容 被隱藏了 嘿嘿

    這個內容 :spoiler[被隱藏了 **嘿嘿**]!

如需更多詳細資訊,請查閱文件

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
0K
0K
Waiting...

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

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

Music Cards

  • Online
Loading...
Loading...
Loading lyrics...
0:00 / 0:00
::music{meting="https://meting.spr-aachen.com/api?server=netease&type=song&id=1390882521"}
  • Local
深海之息
Youzee Music
Loading lyrics...
0:00 / 0:00
::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

    :::note
    Highlights information that users should take into account, even when skimming.
    :::
    :::tip
    Optional information to help a user be more successful.
    :::
  • Custom Titles

    The title of the admonition can be customized.

    MY CUSTOM TITLE

    This is a note with a custom title.

    :::note[MY CUSTOM TITLE]
    This is a note with a custom title.
    :::
  • GitHub Syntax

    Tip

    The GitHub syntax is also supported.

    > [!TIP]
    > 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!

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

For more details, check the Documentation.

暮光指南:進階自訂
/zh-TW/posts/twilight-guide-advanced-customization/
作者
MuxBuffer
发布于
2024-02-10
许可协议
CC BY-NC-SA 4.0
AI參與指數 IIIA-0
分類 未經AI製作
等級 0
簡介 完全未使用AI

此页面可能不是最新版本。