著者の小さなステーション: Quma レコード
非コミット的で、使用される標準ライブラリとHugo
同じtemplate
です。自分だけのユニークなテーマを実現したり、他の人のテーマを変更したりするには、そのテーマについて知っておく必要があります。そうすれば、思う存分テーマを変更したり、シンプルかつエレガントなセットを作成したりできます。golang
html/template
Hugo theme
模板语法
Hugo theme
golang プロジェクトを作成する
明らかに、何が起こっているかgolang
を説明する前に、まずプロジェクトを作成する必要があります。これについては疑いの余地がありません。結局のところ、私たちが今プレイしているのは標準ライブラリです。golang
html/template
golang
golang
html/template
さて、噂話はこれくらいにして、本題に入りましょう。golang
プロジェクトの作成方法については、比較的明確になっているはずです。そうでなければ、この記事を閲覧しないでしょう。もちろん、そんなことは言えません。golang
おそらく彼は、 を開発できるようにテンプレートの構文を理解したいだけなのかもしれませんがHugo theme
、それは事実です。
golang
関連するプロパティの設定方法についてはmodule
過去の記事を参照してください。この記事では詳細な説明は省略し、html/template
文法の説明を中心に説明します。
cmd
コンピューター上の空のファイル(つまり、コマンド ライン)に次のコマンドを入力すると、プロジェクトを作成できます。
go mod init template.qiucode.cn #其中 template.qiucode.cn 是您项目模块名称,您可以起个响亮的名字,以便符合您的气质!(纯属笑谈)
現在のディレクトリに新しいファイルを作成しmain.go
、次のコードを入力します。
package main
import (
"log"
"net/http"
)
func main() {
mux := http.NewServeMux()
mux.HandleFunc("/", home)
mux.HandleFunc("/blog/view", snippetView)
mux.HandleFunc("/blog/create", snippetCreate)
log.Print("Starting server on :4000")
err := http.ListenAndServe(":4000", mux)
log.Fatal(err)
}
main.go
元のリクエスト処理メソッドをファイルに積み重ねて、新しいファイルに抽出しました。次に、新しいファイルを作成する必要がありますがhandlers.go
、その内容は次のとおりです。
package main
import (
"fmt"
"net/http"
"strconv"
)
func home(w http.ResponseWriter, r *http.Request) {
if r.URL.Path != "/" {
http.NotFound(w, r)
return
}
w.Write([]byte("Hello from Snippetbox"))
}
func snippetView(w http.ResponseWriter, r *http.Request) {
id, err := strconv.Atoi(r.URL.Query().Get("id"))
if err != nil || id < 1 {
http.NotFound(w, r)
return
}
fmt.Fprintf(w, "Display a specific snippet with ID %d...", id)
}
func snippetCreate(w http.ResponseWriter, r *http.Request) {
if r.Method != http.MethodPost {
w.Header().Set("Allow", http.MethodPost)
http.Error(w, "Method Not Allowed", http.StatusMethodNotAllowed)
return
}
w.Write([]byte("Create a new snippet..."))
}
テンプレート構成
現在のフォルダーにテンプレート ファイルを作成しますhome.tmpl
。ファイル パスは次のとおりです。
<!doctype html>
<html lang='zh'>
<head>
<meta charset='utf-8'>
<title>首页</title>
</head>
<body>
<header>
<h1><a href='/'>这是头部</a></h1>
</header>
<main>
<h2>主体部分s</h2>
<p>写点什么吧!</p>
</main>
<footer>Powered by <a href='https://golang.org/'>Go</a></footer>
</body>
</html>
handlers.go
ファイルに戻り、そのhome
ハンドラー関数を変更します。
package main
import (
"fmt"
"html/template" // 新添加
"log" // 新添加
"net/http"
"strconv"
)
func home(w http.ResponseWriter, r *http.Request) {
if r.URL.Path != "/" {
http.NotFound(w, r)
return
}
//解析模板文件
ts, err := template.ParseFiles("./ui/html/pages/home.tmpl")
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
return
}
err = ts.Execute(w, nil)
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
}
}
//... 省略其他方法
確かに*.tmpl
フォルダー内にはさらに多くのファイルが存在しますが、ヘッダー、サイドバー、下部などの公開コンテンツを他のページと共有するにはどうすればよいでしょうか? 冗長なコンテンツを排除するために、すべてのテンプレート ファイルにはbase.tmpl
ファイルが含まれます。
{
{define "base"}}
<!doctype html>
<html lang='zh'>
<head>
<meta charset='utf-8'>
<title>{
{template "title" .}} - 秋码记录</title>
</head>
<body>
<header>
<h1><a href='/'>这是头部</a></h1>
</header>
<main>
{
{template "main" .}}
</main>
<footer>Powered by <a href='https://golang.org/'>Go</a></footer>
</body>
</html>
{
{end}}
{
{define "base"}}...{
{end}}
base
各ページに表示するコンテンツを含む という名前のテンプレートを定義するアクション。{
{template "title" .}}
内部的には、 and演算子を使用して、{
{template "main" .}}
特定の場所にある他の名前付きテンプレート ( title
andと呼ばれる) を呼び出すことを示しますmain
。
ui/html/pages/home.tmpl
ファイルの内容を変更してみましょう。
{
{define "title"}}Home{
{end}}
{
{define "main"}}
<h2>这是主体</h2>
<p>说点什么吧!</p>
{
{end}}
もちろん、handlers.go
の処理関数を変更する必要がありますhome
。
package main
import (
"fmt"
"html/template" // 新添加
"log" // 新添加
"net/http"
"strconv"
)
func home(w http.ResponseWriter, r *http.Request) {
if r.URL.Path != "/" {
http.NotFound(w, r)
return
}
files := []string{
"./ui/html/base.tmpl",
"./ui/html/pages/home.tmpl",
}
ts, err := template.ParseFiles(files...)
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
return
}
err = ts.ExecuteTemplate(w, "base", nil)
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
}
}
//... 省略其他方法
したがって、テンプレート セットには HTML を直接含むのではなく、3 つの名前付きテンプレート ( base
、 、title
および )が含まれるようになりましたmain
。私たちはExecuteTemplate()
メソッドを使用して、応答としてGo
どのbase
コンテンツを使用するかを正確に伝えます (これにより、title
およびmain
テンプレートが呼び出されます)。
テンプレートの埋め込み
特定のコンテンツを抽象化し、さまざまなページまたはレイアウト間で再利用したいと考えています。
これを説明するために、次のセクションを含むナビゲーションバーを作成してみましょう。
{
{define "nav"}}
<nav>
<a href='/'>首页</a>
</nav>
{
{end}}
同時にui/html/base.tmpl
ファイルを変更します。
{
{define "base"}}
<!doctype html>
<html lang='zh'>
<head>
<meta charset='utf-8'>
<title>{
{template "title" .}} - 秋码记录</title>
</head>
<body>
<header>
<h1><a href='/'>这是头部</a></h1>
</header>
{
{template "nav" .}}
<main>
{
{template "main" .}} {
{/*添加了这一行内容*/}}
</main>
<footer>Powered by <a href='https://golang.org/'>Go</a></footer>
</body>
</html>
{
{end}}
もちろん、handlers.go
ファイル内の処理関数もhome
それに応じて変更する必要があります。
package main
import (
"fmt"
"html/template" // 新添加
"log" // 新添加
"net/http"
"strconv"
)
func home(w http.ResponseWriter, r *http.Request) {
if r.URL.Path != "/" {
http.NotFound(w, r)
return
}
files := []string{
"./ui/html/base.tmpl",
"./ui/html/partials/nav.tmpl", //添加这一行内容
"./ui/html/pages/home.tmpl",
}
ts, err := template.ParseFiles(files...)
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
return
}
err = ts.ExecuteTemplate(w, "base", nil)
if err != nil {
log.Print(err.Error())
http.Error(w, "Internal Server Error", 500)
}
}
//... 省略其他方法
ブロック
上でも見たように、{
{template}}
. 実際、golang
別のHugo·``中常用的
{
{block}} ... {
{end}}```` オペレーションも提供しています。
例えば:
{
{define "base"}}
<h1>An example template</h1>
{
{block "sidebar" .}}
<p>My default sidebar content</p>
{
{end}}
{
{end}}
間に{
{block}}
デフォルトのコンテンツやアクションを含める必要はありません。{
{end}}
この場合、呼び出されるテンプレートは「オプション」のようなものです。テンプレートがテンプレート セットに存在する場合、それがレンダリングされます。しかし、そうしないと何も表示されません。
著者の小さなステーション: Quma レコード