模板決定了網(wǎng)站內(nèi)容的呈現(xiàn)方式,每個(gè)主題至少都應(yīng)包含一個(gè) index
模板,以下是各頁(yè)面相對(duì)應(yīng)的模板名稱:
模板 | 用途 | 回調(diào) |
---|---|---|
index
|
首頁(yè) | |
post
|
文章 | index
|
page
|
分頁(yè) | index
|
archive
|
歸檔 | index
|
category
|
分類(lèi)歸檔 | archive
|
tag
|
標(biāo)簽歸檔 | archive
|
如果頁(yè)面結(jié)構(gòu)類(lèi)似,例如兩個(gè)模板都有頁(yè)首(Header)和頁(yè)腳(Footer),您可考慮通過(guò)「布局」讓兩個(gè)模板共享相同的結(jié)構(gòu)。一個(gè)布局文件必須要能顯示 body
變量的內(nèi)容,如此一來(lái)模板的內(nèi)容才會(huì)被顯示,舉例來(lái)說(shuō):
index.ejs
index
layout.ejs
<!DOCTYPE html>
<html>
<body><%- body %></body>
</html>
生成:
<!DOCTYPE html>
<html>
<body>index</body>
</html>
每個(gè)模板都默認(rèn)使用 layout
布局,您可在 front-matter 指定其他布局,或是設(shè)為 false
來(lái)關(guān)閉布局功能,您甚至可在布局中再使用其他布局來(lái)建立嵌套布局。
局部模板讓您在不同模板之間共享相同的組件,例如頁(yè)首(Header)、頁(yè)腳(Footer)或側(cè)邊欄(Sidebar)等,可利用局部模板功能分割為個(gè)別文件,讓維護(hù)更加便利。舉例來(lái)說(shuō):
partial/header.ejs
<h1 id="logo"><%= config.title %></h1>
index.ejs
<%- partial('partial/header') %>
<div id="content">Home page</div>
生成:
<h1 id="logo">My Site</h1>
<div id="content">Home page</div>
您可以在局部模板中指定局部變量并使用。
partial/header.ejs
<h1 id="logo"><%= title></h1>
index.ejs
<%- partial('partial/header', {title: 'Hello World'}) %>
<div id="content">Home page</div>
生成:
<h1 id="logo">Hello World</h1>
<div id="content">Home page</div>
如果您的主題太過(guò)于復(fù)雜,或是需要生成的文件量太過(guò)于龐大,可能會(huì)大幅降低性能,除了簡(jiǎn)化主題外,您可以考慮 Hexo 2.7 新增的局部緩存(Fragment Caching) 功能。
本功能借鑒于 Ruby on Rails,它儲(chǔ)存局部?jī)?nèi)容,下次便能直接使用緩存內(nèi)容,可以減少文件夾查詢并使生成速度更快。
它可用于頁(yè)首、頁(yè)腳、側(cè)邊欄等文件不常變動(dòng)的位置,舉例來(lái)說(shuō):
<%- fragment_cache('header', function(){
return '';
});
如果您使用局部模板的話,可以更簡(jiǎn)單:
<%- partial('header', {}, {cache: true});
fragment_cache()
將會(huì)緩存第一次的渲染結(jié)果,并在之后直接輸出緩存的結(jié)果。因此只有在不同頁(yè)面的渲染結(jié)果都相同時(shí)才應(yīng)使用局部緩存。
比如,在配置中啟用了 relative_link
后不應(yīng)該使用局部緩存,因?yàn)橄鄬?duì)鏈接在每個(gè)頁(yè)面可能不同。
更多建議: