自带完整数据 快速建站好帮手
客服QQ客服QQ 微信号微信号

织梦dedecms如何制作排行榜

本文主要介绍了织梦dedecms如何制作排行榜,本教程分享了两种方法,一是用css调整其到合适的位置,二是使用这个标签[field:global name=autoindex/]实现这个方法,推荐给有此需要的朋友。值得参考。

织梦网站源码

编织梦dedecms在编织文章排行榜时,效果如下图所示,该排行榜主要有两个知识点,一是列表前面的数字增加,二是列表前三篇文章编号的背景颜色为蓝色,其他编号的背景为白色。

演示图如下:

织梦制作排行榜

制作这种效果通常有两种方法,一种是截图法,一种是用织梦标签autoindex,详细方法如下:

方法一:把上图文章前面的序号列表截图,1-10的序号都在一个图片上,之后把图片设置为文章列表的背景图片,用css调整其到合适的位置,设置文章列表合适的行宽,就可以了,这样当显示几条文章时,就会显示相应长度的背景。

方法二:用css设置不同样式,例如,设置class=top为前三篇文章序号的样式,而其它文章为默认,[field:global name=autoindex/]标签可以递增的熟练。代码如下:

<UL >

<LI class="top"><EM>[field:global name=autoindex/]</EM><A title=[field:title/] href="[field:arcurl/]" target=_blank>[field:title/]</A></LI>

<LI><EM>[field:global name=autoindex/]</EM><A title=[field:title/] href="[field:arcurl/]" target=_blank>[field:title/]</A></LI>

</UL>

上面<li class="top">是蓝色序号背景样式,具体的css不演示,你可以设置成自己喜欢的样式,而第二个<li>没有class的样式,我们要加个判断条件,当序号小于3时(序号都是从0开始,所以前三项是0,1,2),<li>的class是top ,其它的没有class。把上面的代码,改为:

<UL id=phc1 name="tabul">

{dede:artlist row='' orderby='hot'}

<LI class="[field:global name=autoindex runphp="yes"]

if(@me>3==0)@me="top";

else @me="";     

[/field:global]"><EM>[field:global name=autoindex/]</EM><A title=[field:title/] href="[field:arcurl/]" target=_blank>[field:title/]</A></LI>

{/dede:artlist}

</UL>

即:把<li >中的top改成

[field:global name=autoindex runphp="yes"]

if(@me>3==0)@me="top";

else @me="";     

[/field:global]

这样就可以了,你可以去试一下。当然序号递增主要用[field:global name=autoindex/] ,如果你想得到其它相关效果,可以在百度查相关关键字。

以上就是关于织梦制作排行榜的所有内容,希望可以帮到大家,欢迎扫码加微信一起交流~

微信公众号

TAG标签:织梦制作排行榜

上一个:织梦dedecms如何实现列表页动态调用点击数
下一个:织梦dedecms如何调用文章内容分页{dede:pagebreak/}

返回首页:https://www.why114.com/

瓦窑源码专注织梦网站源码与静态模板分享,提供织梦模板,dedecms模板,帝国企业源码,PHPCMS商用源码和免费模板下载

织梦源码 - DEDE模板 - JQ特效 - CMS教程 - SEO优化 - 热门排行 - Tags标签 - 网站地图 - 免责声明

Copyright©2021 瓦窑源码 Why114.COM 版权所有 鲁ICP备20017802号-2

客服QQ:1847629575 微信号:qilujianzhan

展开