dedecms框架前台页面标签

dedecms 基本包含了一个常规网站需要的一切功能，拥有完善的中文学习资料，很容易上手，学习成本较低。学会dedecms 的模板修改、栏目新增、内容模型新增和常用的标签调用方法后，即便我们不懂 php 语言也能独立完成一个网站了。

在百度网盘中分享，织梦CMS模板制作手册 http://pan.baidu.com/s/1boHLg0f

对于本次项目中使用到的方法和技巧总结如下：

一、标签调用

1. title(标题调用):

首页：{dede:global.cfg_webname/}。cfg_webname 是网站名称的变量名，在 dedecms 后台-->系统基本参数-->站点设置中能发现。

列表页(或单页面)：{dede:field.seotitle/} | {dede:global.cfg_webname/}。{dede:field.seotitle /} 是 seo 标题，在 dedecms 后台，对应栏目的高级选项中能发现，需要保证 seo 标题已经填写了。而后面加上 | 和网站名称，是一般网站的做法，也可以不加。

内容页：{dede:field.title/} | {dede:global.cfg_webname/}。{dede:field.title/} 是内容页调用的标题方法，不仅在 title 标签里可以这样调用，在其他地方需要用到标题时都可以这样调用。比如我在项目中使用到的在其它地方：

<nav>
    <!-- 在手机端，下面的标题才显示 -->
    <h1>{dede:field.title/}</h1>
    <!-- 在手机端，下面的菜单通过切换菜单按钮进行显示和隐藏 -->
    <button id="menu"><i class="iconfont icon-menu"></i></button>
    <ul class="nav-list clearfix">
        <!-- 当前页面的 a 加上 active 类 -->
        {dede:include filename='wqxf_nav.htm'/}
    </ul>
</nav>

field 是用于获取特定栏目或者档案的字段值及常用的环境变量值。

对于内容页，{dede:field.title/} 这种形式的调用方法( field.字段/ )能调用很多我们需要的内容。

{dede:field.shorttitle/} 副标题，{dede:field.keywords/} 关键词，{dede:field.description/} 简介...

首页和内页，{field:title/} 这种形式的调用方法( field:字段/ )能调用很多我们需要的内容。

 

2. 模板的调用：

很多网站的页头和页尾都是一样的，这种情况下，我们可以把这样相同的部分提取出来，单独新建一个模板存放。如果有修改的话，只需要修改一处就可以了，这和把网站的 css 单独写在一个文件里并独立出来是一个道理。

例如：

我把网站的页尾部分单独新建了一个模板存放，取名为 wqxf_footer.htm。当某一个页面需要用到页尾部分的代码时，直接可以这样：{dede:include filename='wqxf_footer.htm'/}。

同样的，如果网站页头部分一样，可以这样：{dede:include filename='wqxf_header.htm'/}。wqxf_header.htm 为文件名，里面是页头部分的代码。

 

3. 导航：

导航的调用方法，是循环调用网站栏目名称。以网站导航只有一级为例，将这代码新建一个模板 wqxf_nav 存放，

<li><a href="/" title="{dede:global.cfg_indexname/}">{dede:global.cfg_indexname/}</a></li>
{dede:channel type='top' row='6' currentstyle="<li><a href='~typelink~' class='active'>~typename~</a></li>"}
<li><a href="[field:typelink/]" title="[field:typename/]">[field:typename/]</a> </li>
{/dede:channel}

解释：

(0). 一般网站栏目里都没有首页这个栏目，所以首页需要单独单用，没法循环，首页不使用模板调用 {dede:include filename="wqxf_nav.htm"} 的方式。

(1). <li><a href="/" title="{dede:global.cfg_indexname/}">{dede:global.cfg_indexname/}</a></li> 中 / 为网页主页链接(在系统参数的站点设置里可以发现)，它的变量名为 cfg_indexurl，所以也可以使用 {dede:global.cfg_indexurl/} 调用。

(2). {dede:global.cfg_indexname/} 调用主页链接名，cfg_indexname 是主页链接名的变量名。

(3). type="top" 表示调用*栏目，也就是一级栏目。

(4). row="6" 表示调用六条数据，也就是六个栏目，出首页这个栏目外，我这里有六个栏目。如果想要调用全部一级栏目，可以不使用。

(5). currentstyle="<li><a href='~typelink~' class='active'>~typename~</a></li>" 很重要，它表示当前样式，比如网站处于当前栏目下，该栏目需要该变一下背景色或者改变文本颜色，我将 class='active' 写在了 a 链接标签下，当然也可以写在 li 列表项标签下，如 currentstyle="<li class='active'><a href='~typelink~'>~typename~</a></li>"

(6). [field:typelink/] 调用栏目链接，[field:typename/] 调用栏目链接标题。type 为指定栏目调用标签。

 

4. 面包屑导航：

列表页(单页)：{dede:field name='position'/}，内容页：{dede:field name='position'/} > {dede:field.title/}。从 dedecms 的系统参数的核心设置里可以发现，栏目位置的间隔符号是 " > "，所以我们也使用这种方式增加内容页的标题。

也可以这样按照自己写页面的 html 那样，原样写出来，如：

<nav class="breadcrumbs container">
    <ol>
        <li>
            <a href="/" title="{dede:global.cfg_indexname/}">{dede:global.cfg_indexname/}</a>
        </li>
        <li>{dede:field.seotitle/}</li>
    </ol>
</nav>

这样做的好处是，不需要修改模板源文件，去除最后的" > "，样式都是自己控制好的，看起来美观一些(把自己写的样式也贴上，供参考)：

/*面包屑导航*/
.breadcrumbs {
    position: relative;
    height: 1.7rem;
    line-height: 1.7rem;
    margin-top: 1.5rem;
}
.breadcrumbs ol {
    position: absolute;
    top: 0;
    left: 0;
    height: 1.7rem;
    line-height: 1.7rem;
}
.breadcrumbs ol li {
    position: relative;
    display: inline-block;
    height: 1.7rem;
    line-height: 1.7rem;
    padding-left: 1.2rem;
    color: #999;
    font-size: 1rem;
}
.breadcrumbs ol li:before {
    content: ">";
    position: absolute;
    top: 0;
    right: -1rem;
}
.breadcrumbs ol li:first-child { padding-left: 0; }
.breadcrumbs ol li:last-child { padding-left: 1.4rem; }
.breadcrumbs ol li:last-child:before { content: ""; } /* 第一个 li 的前面不需要添加生成内容 */
.breadcrumbs ol li a {
    display: block;
    color: #666;
    padding-right: .6rem;
    padding-left: .6rem;
    transition: all .4s ease .1s;
}
@media(min-width: 1200px) {
    .breadcrumbs ol li a:hover { color: #df4526; }    
}

看起来是下面的效果

 这样做的坏处是，代码很多不够简洁。

 

5. 栏目内容：

栏目内容是替代原来栏目单独页的更灵活的一种方式，通常用于企业简介之类的用途。官方建议在栏目模板中用{dede:field.content/}调用。

但是这样做有一个弊端：

当一个栏目下有两个子集栏目时，这两个子集栏目中一个新建了自定义的内容模型，一个使用栏目内容发内容。且它们共用一个模板。这种情况下使用 {dede:field.content/} 是调不出内容的。

这时候就用 sql 的方式调用内容：

{dede:sql sql='Select content from xqxf_arctype where id=12'}
    [field:content/]
{/dede:sql}

解释：

1. xqxf_arctype 是文章类型的数据库表，xqxf 是数据库表前缀。

2. id=12 是栏目 id。

首页也可以这样调用栏目内容。