跳至主要內容

系統配置指南

MIDA 系統的詳細配置選項和自定義設定

2024-01-15 3分鐘 T 中等

MIDA 系統配置指南

本指南將詳細介紹 MIDA 系統的各種配置選項,幫助您自定義和優化您的網站。

配置文件結構

MIDA 支援多種配置格式,推薦使用 hugo.toml

 1# 基本網站設定
 2baseURL = 'https://example.com/'
 3languageCode = 'zh-TW'
 4title = 'My MIDA Site'
 5theme = 'mida'
 6
 7# 內容設定
 8paginate = 12
 9summaryLength = 150
10
11# 參數設定
12[params]
13  # MIDA 特定配置...

基本網站設定

網站資訊

 1title = "我的網站標題"
 2baseURL = "https://example.com/"
 3languageCode = "zh-TW"
 4defaultContentLanguage = "zh-TW"
 5
 6# 網站描述和關鍵字
 7[params]
 8  description = "網站描述文字,用於 SEO"
 9  keywords = ["關鍵字1", "關鍵字2", "關鍵字3"]
10  author = "作者姓名"

內容設定

 1# 分頁設定
 2paginate = 12
 3paginatePath = "page"
 4
 5# 摘要設定
 6summaryLength = 150
 7hasCJKLanguage = true
 8
 9# 內容處理
10[markup]
11  [markup.goldmark]
12    [markup.goldmark.renderer]
13      unsafe = true
14  [markup.highlight]
15    style = "github"
16    lineNos = true
17    codeFences = true

MIDA 核心配置

功能開關

 1[params]
 2  # Alpine.js 功能
 3  enableAlpineListPage = true
 4  
 5  # 動畫效果
 6  enableAnimations = true
 7  
 8  # 搜尋功能
 9  enableSearch = true
10  
11  # 深色模式
12  enableDarkMode = true

效能配置

 1[params.mida.performance]
 2  # 資源壓縮
 3  minify = true
 4  compress = true
 5  
 6  # 圖片優化
 7  imageOptimization = true
 8  lazyLoading = true
 9  
10  # 快取設定
11  cacheVersion = "v1.0"

外觀設定

 1[params.mida.theme]
 2  # 主色調
 3  primaryColor = "#3B82F6"
 4  secondaryColor = "#10B981"
 5  
 6  # 字體設定
 7  fontFamily = "Inter, system-ui, sans-serif"
 8  headingFont = "Inter, system-ui, sans-serif"
 9  
10  # 佈局設定
11  containerMaxWidth = "1280px"
12  sidebarWidth = "280px"

功能模組配置

導航選單

 1[params.navigation]
 2  # 主選單設定
 3  [params.navigation.main]
 4    showBreadcrumbs = true
 5    showSearch = true
 6    
 7  # 側邊欄設定
 8  [params.navigation.sidebar]
 9    showCategories = true
10    showTags = true
11    showRecent = true

部落格功能

 1[params.blog]
 2  # 列表頁設定
 3  showExcerpt = true
 4  showReadingTime = true
 5  showAuthor = true
 6  showDate = true
 7  
 8  # 文章頁設定
 9  showTOC = true
10  showSharing = true
11  showComments = true
12  
13  # 相關文章
14  relatedPosts = 5

文檔功能

 1[params.docs]
 2  # 編輯功能
 3  [params.docs.features]
 4    edit = true
 5    print = true
 6    feedback = true
 7    comments = true
 8    
 9  # Git 整合
10  [params.docs.git]
11    branch = "main"
12    edit_url = "https://github.com/user/repo/edit/main/"
13    issues_url = "https://github.com/user/repo/issues"
14  
15  # 協作功能
16  [params.docs.collaboration]
17    enabled = true
18    require_auth = false

社交媒體配置

社交連結

1[params.social]
2  github = "https://github.com/username"
3  twitter = "https://twitter.com/username"
4  linkedin = "https://linkedin.com/in/username"
5  email = "contact@example.com"

分享按鈕

1[params.sharing]
2  enable = true
3  services = ["twitter", "facebook", "linkedin", "telegram"]
4  
5  # 自定義分享文字
6  twitter_text = "查看這篇文章:"
7  facebook_text = "分享文章:"

SEO 和分析

SEO 設定

 1[params.seo]
 2  # Meta 標籤
 3  includeMetaTags = true
 4  
 5  # Open Graph
 6  enableOpenGraph = true
 7  
 8  # Twitter Cards
 9  enableTwitterCards = true
10  twitterSite = "@username"
11  
12  # JSON-LD 結構化數據
13  enableJSONLD = true

分析工具

 1[params.analytics]
 2  # Google Analytics
 3  googleAnalytics = "G-XXXXXXXXXX"
 4  
 5  # Google Tag Manager
 6  googleTagManager = "GTM-XXXXXXX"
 7  
 8  # 其他分析工具
 9  plausible = "example.com"
10  umami = "umami-id"

自定義樣式

CSS 自定義

 1[params.styles]
 2  # 自定義 CSS 文件
 3  customCSS = ["custom.css", "theme-override.css"]
 4  
 5  # 內聯樣式
 6  customStyles = """
 7    .custom-class {
 8      color: #ff6b6b;
 9    }
10  """

JavaScript 自定義

1[params.scripts]
2  # 自定義 JS 文件
3  customJS = ["custom.js", "analytics.js"]
4  
5  # 第三方腳本
6  externalScripts = [
7    "https://cdn.example.com/script.js"
8  ]

多語言配置

語言設定

 1defaultContentLanguage = "zh-TW"
 2
 3[languages]
 4  [languages.zh-TW]
 5    title = "繁體中文網站"
 6    weight = 1
 7    [languages.zh-TW.params]
 8      description = "繁體中文描述"
 9      
10  [languages.en]
11    title = "English Site"
12    weight = 2
13    [languages.en.params]
14      description = "English description"

開發環境配置

開發模式

1[params.development]
2  # 開發工具
3  showDevTools = true
4  enableLiveReload = true
5  
6  # 除錯資訊
7  showBuildInfo = true
8  logLevel = "debug"

生產環境

1[params.production]
2  # 最佳化設定
3  minifyHTML = true
4  minifyCSS = true
5  minifyJS = true
6  
7  # 安全標頭
8  enableCSP = true
9  enableHSTS = true

配置驗證

檢查配置

1# 檢查配置語法
2hugo config
3
4# 檢查網站結構
5hugo list all
6
7# 驗證內容
8hugo check

常見錯誤

  1. TOML 語法錯誤: 檢查引號和括號
  2. 路徑錯誤: 確認文件路徑正確
  3. 參數拼寫: 檢查參數名稱拼寫

配置範例

完整配置範例

查看 themes/mida/exampleSite/hugo.toml 獲取完整配置範例。

最小配置

1baseURL = 'https://example.com/'
2title = 'My Site'
3theme = 'mida'
4
5[params]
6  enableAlpineListPage = true

下一步

配置完成後,建議您:

  1. 測試各項功能是否正常
  2. 學習 內容管理
  3. 探索 主題自定義

需要幫助?查看 疑難排解或聯繫 技術支援

MIDA Team

🧭

快速導航

🏠 返回文檔中心
📊

文檔資訊

最後更新 2024-01-15
閱讀時間 3 分鐘
字數統計 1325 字
難度等級 🟡 中等