澳门新浦京8455com帝国CMS标签之频道栏目类

澳门新浦京8455com 6

帝国CMS内容页默认是不支持标签调用当前栏目链接的,也许是因为内容页很少用到当前栏目链接的原因呢,真正是什么原因谁知道呢。

  1. 列表调用

灵动标签列表面调用当前父栏目下的所有子栏目:

内容页调用当前栏目链接1

首页:

[e:loop={selectclassid,classname,classpathfrom[!db.pre!]enewsclasswherebclassid=‘$bclassid’orderbyclassid”,0,24,0}]==/”
a href=?=sys_ReturnBqClassname($navinfor,9)?[!---class.name--]/a
{dede:arclist row='10' titlelen='24' typeid='2' orderby='pubdate'}    <li>        <a href="[field:arcurl/]" title="[field:title/]">            <img src="[field:litpic/]" alt="[field:title/]">            <h4>[field:title/]</h4>        </a>    </li>{/dede:arclist}

灵动标签调用当前父栏目下所有子栏目-支持选中状态:

内容页调用当前栏目链接2

. row=’10’ 表示调用十项,最多显示十项。

[e:loop={selectclassname,classpath,classidfromphome_enewsclasswherebclassid=.$class_r[$GLOBALS[navclassid]][bclassid].orderbyclassid,0,24,0}]==
?$r['classid']=$GLOBALS[navclassid];$classurl=sys_ReturnBqClassname($r,9);echo $classurl;?

. titlelen=’24’ 表示标题最多显示 24 个字节,对于常用字, utf-8
的格式下,每一个汉字占三个字节,英文和数字分别占用一个字节。

调用指定栏目名称:

以上两种调用结果都一样,都是直接前后带 // 的,比如 /about/

. typeid=’2′ 是栏目 id 为 2。

?=$class_r[栏目id][classname]?

. orderby=’pubdate’
表示按照发布的时间顺序排序,最后发布的文章排在最前面。

调用指定栏目链接:

列表页:

?=$class_r[栏目ID][classpath]?
{dede:list pagesize='12'}<li>    <a href="[field:arcurl/]" title="[field:title/]">        <img src="[field:litpic/]" alt="[field:title/]">        <h4>[field:title/]</h4>    </a></li>{/dede:list}

灵动标签调用当前栏目别名:

上面是最简单的列表调用方式。

[e:loop={selectclassid,classname,bnamefromphome_enewsclasswhereclassid=$GLOBALS[navclassid],1,24,0}]栏目别名:?=$bqr[bname]?[/e:loop]

. pagesize=’12’ 指明调用 12 项,也就是说最多能显示 12 项。

调用父栏目链接:

. [field:arcurl/] 调用链接。

?=$class_r[$class_r[$GLOBALS[navclassid]][bclassid]][classpath]?

. [field:title/] 调用标题。

调用指定栏目页面内容:

. [field:litpic/] 调用缩略图。

?=$value=ReturnClassAddField(6,classtext);?

列表页之所以不需要加上
id,是因为栏目管理中列表模板已经选定了需要的模板,在该模板下调用不需要指明
id。

调用父栏目下所有子栏目:

链接,标题,缩略图使用频率较高,在内容页的调用方法稍有不同,原因是它们的外面没有嵌套
{dede:…} 之类的标签。调用方法分别为:{dede:field.arcurl/},
{dede:field.title/},{dede:field.litpic/}。

[showclasstemp]$class_r[$GLOBALS[navclassid]][bclassid],1,0,0[/showclasstemp]

  1. 分页

官方手册中的分页为:

{dede:pagelist listsize='3' listitem='index pre pageno next end option'/}

官方解释:

listsize=3 表示 [1][2][3] 这些项的长度 x 2;

index 首页

pre 上一页

pageno 页码

next 下一页

end 末页

option 下拉跳转框

通过实际项目中得出的结论可知:listsize=3
表示 [1][2][3] 这些项的长度 x 2,而是[1][2][3] 这些项的长度
x 2 + 1。

我的分页为:

{dede:pagelist listsize='2' listitem='index pageno end option'/}

我的列表一共 16 项,每一页 3 项,5 页显示不完全,最后一页显示 1 项。

澳门新浦京8455com 1

点击末页时,会全部展示:

澳门新浦京8455com 2

我没有使用 pre和 next 两个字段,这两个字段意义不大。

这里附上自定义的样式:

.pagination-wrap {    margin-top: 30px;    text-align: center;}.pagination {    display: inline-block;    text-align: center;}.pagination:before,.pagination:after {    display: table;    content: "";}.pagination:after { clear: both; }.pagination {    display: inline-block;    text-align: center;}/*根据dedecms模板需要,更改下面样式*/.pagination > li {    float: left;    display: block;    margin-left: -1px; /*消除两个 a 在一起时引起的双倍左外边距*/    height: 30px;    line-height: 28px;    padding-right: 28px;    padding-left: 28px;    border: 1px solid #ddd;    }.pagination > li:first-child {    margin-left: 0; /*第一个 li 不需要消除左外边距*/    border-top-left-radius: 5px;    border-bottom-left-radius: 5px;}.pagination > li:last-child {    border-top-right-radius: 5px;    border-bottom-right-radius: 5px;}.pagination > li > a {    display: block;    width: 100%;    height: 100%;    color: #e04728;    background-color: #fff;    padding-right: 15px;    padding-left: 15px;}.pagination > li {    z-index: 3;    cursor: default;    color: #e04728;}.pagination > li.thisclass {    z-index: 3;    color: #fff;    cursor: default;    background-color: #e04728;    border-color: #e04728;}.pagination > li > select {    display: inline-block;    margin-left: -1px; /*消除两个 a 在一起时引起的双倍左外边距*/    border: 1px solid #ddd;    height: 30px;    line-height: 28px;    padding-right: 28px;    padding-left: 28px;    color: #e04728;}    .pagination > li > select option {    display: block;    text-align: center;    padding-top: 6px;    padding-bottom: 6px;}.pagination > li > select option[selected] {    color: #fff;    background-color: #e04728;}.pagination > li > select option:hover { background-color: #eee; }

// dedecms 模板下新增脚本// 去除分页时 select 的宽度$(".pagination > li > select").css("width", "auto");// 对 li 没有 select 子元素时,设置样式$(".pagination > li:has").css({    paddingRight: 0,    paddingLeft: 0,    border: "none"});$(".pagination > li:has").css({    paddingRight: 0,    paddingLeft: 0});$(".pagination > li.thisclass + li").css("marginLeft", 0);
  1. 多级栏目调用

栏目及其子栏目如下:

澳门新浦京8455com 3

以我自己的实例为例,调用指定栏目下的全部二级栏目

<ul class="content" id="categoriesList">    {dede:channelartlist typeid='3' row='1' channelid='17' addfields='product'}        {dede:channel type='son' noself='yes'}        <li><a href="[field:typelink/]" title="[field:typename/]">[field:typename/]</a></li>        {/dede:channel}    {/dede:channelartlist}</ul>

. typeid=’3′ 是要指定的栏目的 id 。

. row=’1′ 表示循环一次(我试过如果不设置 row
的值的话,会重复调用13次,因为我这里它的二级子栏目为 13 个)

. channelid=’17’ 表示自定义内容模型的 id 号

. addfields=’product’ 表示自定义内容模型的识别 id

. type=’son’ 表示为其指定栏目的子栏目。

  1. 当前栏目的高亮显示

栏目的高亮显示,一般是把当前栏目的字体变成不同于其他栏目的颜色,或者对其添加不同于其他栏目的背景颜色。在
dedecms 里分两种情况讨论:

.
对于导航,一个导航栏目下可能拥有多个二级子栏目,当该页面属于该栏目的子栏目时,这个栏目也需要高亮显示。这里使用
dedecms 官方文档里的介绍方法:

currentstyle="<li><a href='~typelink~' class='active'>~typename~</a></li>"

具体查看 第三条。

. 对于二级栏目,使用 js 为其添加高亮的功能,更简单些。

以我自己的实例说明:

<ul class="content" id="categoriesList">    <li><a href="#" title="木质防火门">木质防火门</a></li>    <li><a href="#" title="钢质防火门">钢质防火门</a></li>    <li><a href="#" title="钢木质防火门">钢木质防火门</a></li>    <li><a href="#" title="固定式防火窗">固定式防火窗</a></li></ul>

方法是,当 a 标签的 href 属性的属性值和页面当前的 url
地址(document.location.href) 能匹配时,就为其添加高亮显示。

var nav = document.getElementById("categoriesList").getElementsByTagName("a");for(var i = 0; i < nav.length; i++){    var navLinks = nav[i].getAttribute;  // 获得链接的 href 属性值    var pageLink = document.location.href; // 获得当前页面的地址    if(pageLink.indexOf != -1){  // 如果没有找到匹配的字符串则返回 -1,不等于 -1,说明匹配到了        nav[i].className = "active";  // 为其添加 active 类    }}

/*css*/#categoriesList li a.active {    color: #a67650;}

澳门新浦京8455com 4

  1. 上一篇

上一篇和下一篇的调用比较简单,官方文档为:

上一篇:{dede:prenext get=’pre’/}

下一篇:{dede:prenext get=’next’/}

于是,我的 dom 也简单:

<ul class="pre-next clearfix">    <li class="pre">    {dede:prenext get='pre'/}    </li>    <li class="next">    {dede:prenext get='next'/}    </li></ul>

/*上一篇、下一篇*/.pre-next li {    width: 48%;    height: 30px;    line-height: 30px;    font-size: 14px;    overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}.pre-next .pre {    float: left;    text-align: right;}.pre-next .next {    float: right;    text-align: left;}.pre-next li a {    padding-right: 8px;    padding-left: 8px;}.pre-next li a:hover {    color: #ef4526;}

澳门新浦京8455com 5

澳门新浦京8455com 6

You can leave a response, or trackback from your own site.

Leave a Reply

网站地图xml地图