模板继承

标准语法

{{extend './layout.art'}}
{{block 'head'}} ... {{/block}}

使用方法：

layout.html

<!DOCTYPE html> <html lang="en"> <head>    
    <meta charset="UTF-8">    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">    
    <title>Document</title> 
    </head> 
    <body>    
        {{ include'./header.html' }}        
        *<!-- 留一个坑，将来留给孩子去填坑 -->*    

    &#123;&#123; block 'content' &#125;&#125;          
    <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>h1</span><span class="token punctuation">></span></span>默认内容<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>h1</span><span class="token punctuation">></span></span>    
    &#123;&#123; /block &#125;&#125; 
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>body</span><span class="token punctuation">></span></span> 


</html>
:hexoPostRenderEscape–>

index.html

<!-- 在 index.html 中继承 layout.html -->

<!– 不填坑就显示默认内容 填坑就显示填坑内容 –>


{{ extend ‘./layout.html’ }}


<!– 填坑 –>
{{ block ‘content’ }}
    <div>
        <h1>
            index 页面填坑内容
        </h1>
    </div>
{{ /block }}
:hexoPostRenderEscape–>

子模板

标准语法

{{ include'./header.art' }}

使用方法：

header.html

<div>公共的头部</div>

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    {{ include'./header.html' }}
    <h1>index 页面</h1>
</body>
</html>