tabi

？分趾襪

一個易於存取的 Zola 主題，具有搜尋、多語言支援、可選 JavaScript、完美的 Lighthouse 分數和全面的文件。專為個人網站和部落格而設計。

提示

想立即開始寫部落格嗎？使用 tabi-start 範本可在幾分鐘內啟動並執行完整的網站。

請在此處查看即時預覽（以及主題的文件）。

探索使用 tabi 的網站部分以查看實際應用程式。

tabi (旅, / t ɐ ˈ b i /): 旅程。

tabi 在 Google Lighthouse 審核中獲得滿分：

特徵

• 將任何語言設定為預設語言。將您的基本網站設​​定為中文、西班牙語、法語、印地語…或任何其他支援的語言。主題的介面將進行相應的翻譯。
• 與 GitHub、GitLab、Gitea 和 Codeberg 上的遠端儲存庫集成，以取得提交歷史記錄並顯示網站原始碼。
• 系列支援創建連續內容，例如教程、課程和多部分故事。
• 深色和淺色主題。預設為作業系統設置，導覽列中有一個切換器。
• 完整的文檔。請參閱掌握分趾襪設定：綜合指南。
• Lighthouse 完美得分（效能、可訪問性、最佳實踐和 SEO）。
• 全面的多語言支援。新增任意數量的語言。
• 支援使用 giscus、utterances、Hyvor Talk 或 Isso 進行評論。
• 基於 Catppuccin Frappé 的程式碼語法突出顯示顏色。
• Mermaid 支援用文字建立圖表。
• 具有易於存取的多語言介面的本地搜尋。
• 自訂 Twitter 卡和自動開放圖譜標籤。
• KaTeX 支持數學符號。
• 程式化且人類可讀的 Atom feed。
• 風格化且易於閱讀的網站地圖。
• 用於垃圾郵件防護的郵件編碼。
• 所有 JavaScript 都可以完全停用。
• 可自訂的目錄。
• 可自訂的安全標頭。
• 代碼塊的複製按鈕。
• 快速導航按鈕。
• 自訂版權聲明。
• 自訂規範 URL。
• 自訂短代碼。
• 可客製化的皮膚。
• 社群媒體卡。
• 響應式設計。
• 項目頁面。
• 存檔頁面。
• 固定帖子。
• 社交連結。
• 標籤。

安裝

筆記

建立新網站的最快方法是使用 tabi-start 範本。這為您提供了完整的部落格設置，其中所有基本配置都已準備就緒。

手動安裝

要將分趾襪添加到您現有的 Zola 站點：

0. 在專案目錄中初始化 Git 儲存庫（如果尚未初始化）：

 git init

1. 將主題新增為 git 子模組：

 git submodule add https://github.com/welpo/tabi.git themes/tabi

或將主題複製到您的主題目錄中：

 git clone https://github.com/welpo/tabi.git themes/tabi

所需配置

2. 在config.toml中啟用主題：

 theme = "tabi"

3. 在config.toml中設定title ：

 title = "Your Site Title"

4. 在config.toml中設定程式碼區塊突出顯示：

[ markdown ]
highlight_code = true
highlight_theme = " css "

5. 建立content/_index.md檔案。該文件控制主頁的外觀和行為。選擇以下選項之一：

   選項 A：從/提供貼文：

    +++
   title = "Home"
   paginate_by = 5  # Show 5 posts per page.
   +++
   

   • 這將在content/中顯示帶有分頁的貼文。

   選項 B：從不同的路徑提供貼文（例如blog/ ） ：

    +++
   title = "Home"
   # Note we're not setting `paginate_by` here.
   
   [extra]
   section_path = "blog/_index.md"  # Where to find your posts.
   max_posts = 5  # Show 5 posts on the home page.
   +++
   

   • 這將顯示blog/部分的最新 5 篇貼文。
   • 如果選擇此選項，請勿設定paginate_by 。
   • 使用該部分的_index.md檔案的完整路徑。使用section_path = "blog/"將無法運作。

警告

不要在content/_index.md中同時設定paginate_by和section_path 。

這些設定是互斥的，同時使用這兩個設定可能會導致不顯示任何貼文。

6. 如果您想要介紹部分（請參閱上面的螢幕截圖），請將這些行新增至content/_index.md ：

 [extra]
header = {title = "Hello! I'm tabi~", img = "img/main.webp", img_alt = "Your Name" }

前面內容以外的內容將呈現在標題標題和貼文清單之間。在上面的螢幕截圖中，文字顯示「tabi 是一個快速、輕量級且現代的 Zola 主題...」。

7. 如果您想要一個多語言網站，則需要設定每種語言。在config.toml中，設定每種語言的標題和分類法，例如：

[ languages . es ]
title = " ~/tabi "
taxonomies = [{ name = " tags " , feed = true }]

對於要以該語言啟用的每個部分（例如 /blog 或 /projects），您將需要每種語言的_index.{language_code}.md

對於單一帖子也是如此，其名稱應與預設語言完全相同，並在擴展名之前添加額外的.{code} （例如，西班牙語版本的security.md將是security.es.md ）。

此配置允許語言切換器將使用者帶到目前 URL 的翻譯。如果翻譯不存在，將顯示 404 頁面，並在配置中設定每種語言的解釋。

要了解有關多語言支援的更多信息，請參閱常見問題。

更新分趾襪

如果您將主題新增為 git 子模組，請執行：

git submodule update --remote themes/tabi

如果你克隆了它：

 cd themes/tabi
git pull

使用分趾襪的網站

網站	創作者	描述	網站來源
osc花園	奧斯卡費爾南德斯 (welpo)	數據科學、心理學和佐拉	來源
桑迪普直播	桑德普G (桑德普)	新創企業、科技與美好生活	來源
seadve.github.io	戴夫·帕特里克·卡貝托 (SeaDve)	帶有自訂 CSS 的個人部落格和作品集	來源
米酷飯頁面	納迪亞	個人部落格	來源
蒂姆·博徹在線	提姆·博徹	一個聾盲程式設計師的見解和漫談	來源
www.richtman.au	阿里爾·里奇曼	個人技術博客	來源
黃松遊戲	約翰‧布拉克 (JVimes)	友善的獨立遊戲公司	—
jmbhughes.com	馬庫斯‧休斯 (jmbhughes)	個人部落格	來源
szabolcs.me	Szabolcs Fazekas (szabolcsf)	個人部落格	來源

使用分趾襪？請隨意建立 PR 並將您的網站新增至此清單。

靈感

這個主題的靈感來自於：

• shadharon — tabi 最初是 syedzayyan 主題的一個分支
• tailwind-nextjs-starter-博客
• 刪節

支援

有什麼不工作嗎？有想法嗎？讓我們知道！

• 問題？ → 開始討論
• 發現錯誤？ → 在此報告
• 功能要求？ → 告訴我們更多！

貢獻

請這樣做！我們感謝錯誤報告、翻譯或文件的改進（無論多麼微小）、功能請求…

查看貢獻指南以了解更多資訊。

執照

該代碼可在 MIT 許可下使用。