Skip to content

設定頁尾(Footer)

在 Zensical，你可以透過 zensical.toml 設定 Footer，或者使用 overrides/footer.html 來完全自訂 Footer。

你可以在 zensical.toml 設定 Footer 內容：

[project]
copyright = "Copyright © 2026 唯客學院"

[project.extra]
generator = false

[[project.extra.social]]
icon = "fontawesome/brands/github"
link = "https://github.com/your-repo"

[[project.extra.social]]
icon = "fontawesome/brands/facebook"
link = "https://facebook.com/your-profile"

📌 這樣 Footer 會顯示社交連結，並隱藏「Made with Zensical」標語。

若要在頁尾顯示上一頁 / 下一頁：

[project.theme]
features = [
  "navigation.footer",
]

如果你想完全 自訂 Footer，可以建立 overrides/partials/footer.html 來修改底部內容。

步驟 1：建立覆寫檔

.
├── overrides/
│   └── partials/
│       └── footer.html
└── zensical.toml

步驟 2：在 zensical.toml 啟用自訂模板

[project.theme]
custom_dir = "overrides"

步驟 3：編輯 footer.html

可複製官方 footer.html 再修改，或寫自己的 HTML。版權文字也可以直接用 copyright 設定，不必整份覆寫。

如果你希望調整 Footer 的樣式，可以使用 自訂 CSS。

步驟 1：建立 extra.css

.md-footer {
    background-color: #222;
    color: white;
    text-align: center;
    padding: 10px;
}

.md-footer a {
    color: #ff4081;
}

步驟 2：在 zensical.toml 啟用

[project]
extra_css = [
  "css/extra.css",
]

總結

方式 設定方式 適用場景
內建簡單 Footer copyright、generator、social 快速設定社交媒體連結
上一頁 / 下一頁 navigation.footer 文件導覽
完全自訂 Footer overrides/partials/footer.html 自訂 HTML 內容
調整 Footer 樣式 使用 extra.css 更改背景顏色、文字樣式

📌 這樣你就可以 輕鬆自訂 Zensical 的 Footer！

參考資料