页眉和页脚


分离页眉和页脚

编辑index.html模板里的底部部分,剪切底部的代码,在couch/snippets里新建一个footer.html文件,

把底部代码放进去,再在index.html底部放入一个引用代码,头部依此照做,这样首页头部和尾部就分离出来了

<cms:embed 'header.html' />
中间内容...
<cms:embed 'footer.html' />

此处注意header.html不包含顶部的<head></head>,只把顶部导航分离出去公用

 

调用编辑TDK

再把全局的网站关键词、描述、标题放进index.html,加好的代码应该是下面的样子

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><cms:get_field 'site_name' masterpage='globals.php' /></title>
    <meta name="description" content="<cms:get_field 'site_desc' masterpage='globals.php' />">
    <meta name="keywords" content="<cms:get_field 'site_keywords' masterpage='globals.php' />">
    <link rel="stylesheet" href="css/uikit.min.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_3343514_uzeq7hf9dn.css">
    <script src="js/uikit.min.js"></script>
    <script src="js/uikit-icons.min.js"></script>
    <script src="js/jquery-3.6.0.min.js"></script>
    <script src="js/jquery-migrate-3.3.2.min.js"></script>
</head>
<body>
<cms:embed 'header.html' />

 

从全局设置里调用底部信息放入footer.html里,加好的代码如下:

    <div class="copyright">
        <div class="uk-container">
            <cms:get_field 'site_copyright' masterpage='globals.php' />
        </div>
    </div>
</body>
</html>