您现在的位置是:首页 > cms教程 > DedeCMS教程DedeCMS教程

织梦dedecms列表页实现有缩略图显示图文列表没有则文字列表

白晴2023-09-24DedeCMS教程已有人查阅

导读或者你可以进入代码号列表页查看效果,整体思路其实就是利用dedecms的[field:array runphp='yes']这个标签的@me包含了需要的所有标签,

或者你可以进入代码号列表页查看效果,整体思路其实就是利用dedecms的[field:array runphp='yes']这个标签的@me包含了需要的所有标签,这样就可以通过@me["litpic"]来判断文章是否有缩略图,进而分两种形式输出列表html,即有缩略图的和没有缩略图的
具体代码如下:
<styletype="text/css">
.arcList.itemMod{border-bottom:dashed1px#ccc;margin-bottom:15px;padding-bottom:15px;}
.arcList.imgListItem{height:130px;padding-left:215px;position:relative;}
.arcList.img{left:0;position:absolute;top:0;}
.arcList.arcTit{font-family:MicrosoftYahei;font-size:16px;font-weight:700;}
.arcList.attrs{height:22px;line-height:22px;margin:10px0;}
.arcList.click{margin-left:50%;}
.arcList.infos{color:#666;font-size:12px;margin:0;}
</style>
<divclass="arcList">
	{dede:listpagesize='10'}
			[field:arrayrunphp='yes']
				if(empty(@me["litpic"])||preg_match('/defaultpic/',@me["litpic"])){
					@me='<divclass="itemModtxtListItem"><divclass="text"><divclass="arcTit"><aclass="t"href="'.@me["arcurl"].'">'.@me["fulltitle"].'</a></div><pclass="attrs">'.GetDateTimeMK(@me["pubdate"]).'<spanclass="click"><span>点击:</span>'.@me["click"].'</span></p><pclass="infos">'.@me["infos"].'...<aclass="fc_orange"href="'.@me["arcurl"].'"title="'.@me["fulltitle"].'">[全文]</a></p></div></div>';
				}
				else{
					@me='<divclass="itemModimgListItem"><aclass="img"href="'.@me["arcurl"].'"><imgclass="lazy"src="'.@me["litpic"].'"width="200"height="130"alt="'.@me["fulltitle"].'"/></a><divclass="text"><divclass="arcTit"><aclass="t"href="'.@me["arcurl"].'">'.@me["fulltitle"].'</a></div><pclass="attrs">'.GetDateTimeMK(@me["pubdate"]).'<spanclass="click">点击:'.@me["click"].'</span></p><pclass="infos">'.@me["infos"].'...<aclass="fc_orange"href="'.@me["arcurl"].'"title="'.@me["fulltitle"].'">[全文]</a></p></div></div>';
				}
			[/field:array]
	{/dede:list}
</div>
可有可无的代码解析:
先说下样式吧,如果阁下会css完全可以根据自己的需求来定制样式,
if(empty(@me["litpic"]) || preg_match('/defaultpic/', @me["litpic"]))
这段代码就是判断是否有缩略图的,通过判断后下面就是分两种情况输出了,其实都很简单,这里说下调用字段数据,象平时都是用[field:fulltitle/],这里就要改成@me["fulltitle"],另外还有一点就是php语法的问题,细心的朋友可能已经发现了'.@me["fulltitle"].'两边都有.',也就是说@me["xxx"]是变量

本文标签:

很赞哦! ()

相关源码

  • 帝国cms大气淘宝客网站源码带手机版带火车头采集本款创意礼物导购网站模板为礼物类电商平台设计,采用清爽简约的界面风格,具备完善的商品导购功能。系统支持在文章攻略中灵活插入商品购买链接,实现内容与电商的结合。查看源码
  • (自适应响应式)HTML5简繁双语电子元器件设备制造Pbootcms模板下载本模板为电子科技设备制造、电子元件生产等高科技企业设计,采用PbootCMS内核开发,具备简繁双语切换功能。模板设计充分考虑了电子科技行业的技术展示需求,能够专业呈现各类电子元器件、电路板、智能设备的参数规格和应用方案。查看源码
  • (PC+WAP)企业管理工程造价资产评估财务审计带留言网站模板本模板基于PbootCMS内核开发,为工程造价咨询、财务审计类企业量身打造,同时支持多行业快速适配。采用PC+WAP双端同步设计,数据实时互通,助您高效展示企业形象与服务能力。查看源码
  • (自适应响应式)黑色酷炫高端数码摄影pbootcms网站模板源码本模板基于PbootCMS开发,为摄影工作室、个人摄影师及摄影爱好者设计。采用深色系风格,突出摄影作品展示效果,适配各类数码设备浏览。适用于作品集展示查看源码
  • WordPress主题模板JustNews资讯博客类源码V5.2.2JustNews主题针对博客创作、自媒体运营及资讯发布类网站的需求而设计,提供专业的内容展示与管理方案。该主题集成前端用户中心功能,支持用户在前端界面发布和投稿文章,操作流程简洁高效。查看源码
  • (自适应响应式)个人作品技术文章博客网站模板下载基于PbootCMS内核开发的响应式博客模板,为数字营销、技术分享类内容打造。采用前沿设计理念,兼顾内容展示与阅读体验,适配各类终端设备。通过本模板可快速构建专业级行业博客,有效传播专业知识与案例成果。查看源码
分享笔记 (共有 篇笔记)
验证码:

本栏推荐