织梦dedecms排行榜制作

织梦dedecms 在做文章排行榜时,效果如下图,这个排行主要有两个知识点,其一是列表前面数字递增,其二是列表的前三篇文章序号背景色蓝色,其它序号背景是白色。

织梦dedecms排行榜制作

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

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

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

<LIclass="top"><EM>[field:globalname=autoindex/]</EM><Atitle=[field:title/]href="[field:arcurl/]"target=_blank>[field:title/]</A></LI>

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

</UL>

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

<ULid=phc1name="tabul">

{dede:artlistrow=''orderby='hot'}
<LIclass="[field:globalname=autoindexrunphp="yes"]
if(@me>3==0)@me="top";
else@me="";
[/field:global]"><EM>[field:globalname=autoindex/]</EM><Atitle=[field:title/]href="[field:arcurl/]"target=_blank>[field:title/]</A></LI>

{/dede:artlist}

</UL>

即:把<li>中的top改成[field:globalname=autoindexrunphp="yes"]
if(@me>3==0)@me="top";
else@me="";
[/field:global]

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

版权免责声明

① 本站VIP源码资源永久免费下载 www.wayu.cn
② 本网站资源来源于网络收集,如有侵权,请联系站长进行删除处理。
③ 分享目的仅供大家学习和交流,请不要用于商业用途,否则后果自负。
④ 如果你有源码需要出售,可以联系小编,或者点击 投稿
⑤ 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解。
⑥ 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需。
⑦ 在您的能力范围内,为了大环境的良性发展,请尽可能的选择正版资源。
⑧ 网站资源不做任何二次加密和授权后门(原版加密除外)

评论0

请先

没有账号? 忘记密码?