點燈坊

失くすものさえない今が強くなるチャンスよ

Dot 與 Page Object 與 Site Object 關係

Sam Xiao's Avatar 2024-05-09

Go Template 的 . 有 Context 概念，本文解釋為什麼 . 可以存取 Page Object 與 Site Object。

Version

Hugo 0.125.5

Page

context001

  • My Hugo Site 是 Site object 的 title
  • My Blog 是 Page object 的 title

Content

content/_index.md

---
title: My Blog
description: Hello World
subtitle: Blog for Myself
---
  • title 定義在 Page object

Site Config

hugo.json

{
   "baseURL": "https://example.org/",
   "languageCode": "en-us",
   "title": "My Hugo Site"
}
  • title 定義在 Site object

Layout

layouts/index.html

<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="style.css" />
    <title>{{ .Site.Title }}</title>
  </head>
  <body>
    <h1 class="title">{{ .Title }}</h1>
  </body>
</html>

Line 7

<title>{{ .Site.Title }}</title>
  • .Site.Title : title 是定義在 hugo.json 的 Site object 內

Line 10

<h1>{{ .Title }}</h1>
  • .Title : title 是定義在 Markdown 的 Page object 內

Context

context000

  • . 表示 目前 的 context
  • 在 template 內，預設的 context 為 Page object，也就是 . 為 Page object，這也就是為什麼 .title 為 Page object 的 title
  • Page Object 下的 Site 為 Site object，這也就是為什麼 .Site.title 為 Site object 的 title

Style

static/style.css

.title {
  color: #f00;
  font-size: 2rem;
  font-weight: 700;
}

Conclusion

  • 每個 template 預設的 context 為 Page object，因此我們可以直接以 . 存取 Page object
  • 因為 Site object 也定義在 Page object 下，因此我們可以直接以 .Site 存取 Site object

# Hugo