内容视图模板
这些替代的内容视图在列表模板中特别有用。
以下是内容视图的常见用法:
- 你希望在首页上展示每种类型的内容,但只是以有限的摘要视图呈现。
- 你只想在taxonomy列表页面上展示内容的项目列表。通过将不同类型的内容的渲染委托给内容本身,视图使这个过程变得非常简单。
创建内容视图
要创建一个新视图,请在每个不同内容类型的目录中创建一个以视图名称命名的模板。下面的示例包含了posts
和project
内容类型的"li"视图和"summary"视图。正如你所看到的,它们与单一内容视图模板single.html
并列。你甚至可以为特定类型提供一个特定的视图,并继续使用_default/single.html
作为主要视图。
▾ layouts/
▾ posts/
li.html
single.html
summary.html
▾ project/
li.html
single.html
summary.html
Hugo 还支持使用默认内容模板,以便在没有为该类型提供特定内容视图模板的情况下使用它。内容视图也可以在_default
目录中定义,并且会和列表和单一模板一样在查找顺序上下传递到_default
目录中。
▾ layouts/
▾ _default/
li.html
single.html
summary.html
哪个模板会被呈现?
下面是内容视图的查找顺序:
/layouts/<TYPE>/<VIEW>.html
/layouts/_default/<VIEW>.html
/themes/<THEME>/layouts/<TYPE>/<VIEW>.html
/themes/<THEME>/layouts/_default/<VIEW>.html
示例:在列表中使用内容视图
下面的示例演示了如何在你的列表模板中使用内容视图。
list.html
在这个例子中,.Render
被传递到模板中,调用render function。.Render
是一个特殊函数,用于指示内容使用作为第一个参数提供的视图模板来呈现自己。在这种情况下,模板将呈现后面的summary.html
视图:
layouts/_default/list.html
<main id="main">
<div>
<h1 id="title">{{ .Title }}</h1>
{{ range .Pages }}
{{ .Render "summary" }}
{{ end }}
</div>
</main>
summary.html
Hugo 将整个页面对象传递给以下summary.html
视图模板。(请参阅 Page Variables获取完整的列表。)
layouts/_default/summary.html
<article class="post">
<header>
<h2><a href='{{ .Permalink }}'> {{ .Title }}</a> </h2>
<div class="post-meta">{{ .Date.Format "Mon, Jan 2, 2006" }} - {{ .FuzzyWordCount }} 字 </div>
</header>
{{ .Summary }}
<footer>
<a href='{{ .Permalink }}'><nobr>阅读更多 →</nobr></a>
</footer>
</article>
li.html
在前面的例子中,我们可以通过在.Render
函数调用中更改参数(即{{ .Render "li" }}
)来将我们的渲染函数更改为使用一个较小的li.html
视图。
layouts/_default/li.html
<li>
<a href="{{ .Permalink }}">{{ .Title }}</a>
<div class="meta">{{ .Date.Format "Mon, Jan 2, 2006" }}</div>
</li>