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

易优cms筛选标签Screening使用方法示例

文驹治2025-04-03易优cms教程已有人查阅

导读id='' 可以任意指定循环里的变量名替代field,假设id='field1',模板调用如:{$field.title} 变成 {$field1.title}typeid='' 专用于首页筛选,首页调用标签一定要指定栏目ID

[基础用法]
名称:screening
功能:筛选文章
语法:
{eyou:screening id='field' currentstyle='active' alltxt='不限' }
<div class="row">
<div class="filter-box">
<!-- 筛选项栏目循环 -->
{eyou:volist name='$field.list' id='vo'}
<div class="filter-boxs">
<!-- 筛选项标题 -->
<div class="filter-tit">
{$vo.title} :
</div>
<!-- 筛选的可选值循环 -->
<div class="filter-cen">
{eyou:volist name='$vo.dfvalue' id='val'}
<a {$val.onClick} class="{$val.currentstyle}">{$val.name}</a>
{/eyou:volist}
</div>
<!-- 筛选的可选值循环结束 -->
</div>
{/eyou:volist}
<!-- 筛选项栏目循环结束 -->
<!-- 清除所有筛选条件按钮 -->
<div class="filter-bt"><a href="{$field.resetUrl}">清除筛选条件</a></div>
</div>
<!-- 隐藏域 -->
{$field.hidden}
</div>
{/eyou:screening}
参数:
id='' 可以任意指定循环里的变量名替代field,假设id='field1',模板调用如:{$field.title} 变成 {$field1.title}
typeid='' 专用于首页筛选,首页调用标签一定要指定栏目ID
currentstyle='' 应用样式class类名
addfields='' 自定义字段名,多个字段之间用英文逗号隔开,比如:addfields='price,spce'
alltxt='' 筛选数值中的第一个自定义选项,该选项是用于重置单条筛选条件,比如:alltxt='全部',alltxt='不限',alltxt='所有'
empty='' 没有数据时显示的文案
底层字段:
请查阅易优Cms官方提供的数据字典,找到表名 ey_channelfield 、ey_article_content
-------------------------------效果展示--------------------------------
1,调用指定栏目文章
模板调用标准代码
{eyou:screening id='field' currentstyle='active' alltxt='全部'}
<div class="row">
<div class="filter-box">
{eyou:volist name='$field.list' id='vo'}
<div class="filter-boxs">
<div class="filter-tit">
{$vo.title} :
</div>
<div class="filter-cen">
{eyou:volist name='$vo.dfvalue' id='val'}
<a {$val.onClick} class="{$val.currentstyle}">{$val.name}</a>
{/eyou:volist}
</div>
</div>
{/eyou:volist}
<div class="filter-bt"><a href="{$field.resetUrl}">清除筛选条件</a></div>
</div>
{$field.hidden}
</div>
{/eyou:screening}
网站前端显示效果(css样式请自行填充)
【更多示例】
-------------------------------示例1--------------------------------
描述:指定自定义字段读取筛选条件
{eyou:screening id='field' currentstyle='active' addfields='danxuan' alltxt='不限'}
<div class="row">
<div class="filter-box">
{eyou:volist name='$field.list' id='vo'}
<div class="filter-boxs">
<div class="filter-tit">
{$vo.title} :
</div>
<div class="filter-cen">
{eyou:volist name='$vo.dfvalue' id='val'}
<a {$val.onClick} class="{$val.currentstyle}">{$val.name}</a>
{/eyou:volist}
</div>
</div>
{/eyou:volist}
<div class="filter-bt"><a href="{$field.resetUrl}">清除筛选条件</a></div>
</div>
{$field.hidden}
</div>
{/eyou:screening}
-------------------------------示例2--------------------------------
描述:关闭 “不限” 筛选按钮
{eyou:screening id='field' currentstyle='active' alltxt='off'}
<div class="row">
<div class="filter-box">
{eyou:volist name='$field.list' id='vo'}
<div class="filter-boxs">
<div class="filter-tit">
{$vo.title} :
</div>
<div class="filter-cen">
{eyou:volist name='$vo.dfvalue' id='val'}
<a {$val.onClick} class="{$val.currentstyle}">{$val.name}</a>
{/eyou:volist}
</div>
</div>
{/eyou:volist}
<div class="filter-bt"><a href="{$field.resetUrl}">清除筛选条件</a></div>
</div>
{$field.hidden}
</div>
{/eyou:screening}

本文标签:

很赞哦! ()

相关源码

  • 帝国cms自适应古诗词古籍名句网站整站带数据基于帝国CMS打造的专业古诗词文化网站模板,专注于古典文学内容的展示与传播。模板设计蕴含传统文化韵味,支持诗词鉴赏、名句赏析、古籍整理等特色功能,为诗词爱好者提供优质的在线阅读体验。查看源码
  • (自适应)蓝色沙盘复古建筑模型制作网站模板源码下载为建筑沙盘模型企业设计的响应式网站模板,通过三维空间展示技术结合产品参数可视化,有效提升模型作品的线上呈现效果与客户咨询转化率。查看源码
  • (自适应)英文绿色精密模具零件加工五金零件pbootcms外贸网站模板本模板基于PbootCMS开发,为五金零件、精密模具加工等英文外贸企业设计。采用响应式布局,适配各类移动设备,是五金零件企业开展国际贸易的专业展示平台。查看源码
  • (自适应)酒店民宿客房旅馆pbootcms模板下载基于PbootCMS内核开发的酒店民宿行业专用网站模板,专注于为住宿服务企业提供专业高效的在线展示平台。该模板采用响应式设计结构,确保在不同终端设备上均能呈现优质浏览体验。查看源码
  • (自适应响应式)投资理财金融机构财务管理pbootcms模板本模板基于PbootCMS系统开发,为投资理财、金融机构等行业设计。采用专业严谨的布局风格,突出金融服务行业特色,适合展示各类理财产品、投资服务和金融资讯。查看源码
  • (自适应)html5中英双语通用机械设备pbootcms模板下载本模板基于PbootCMS内核精心开发,为机械设备制造企业量身打造。设计风格大气稳重,充分展现机械行业的专业特质与技术实力。采用HTML5技术构建,支持中英文双语切换,满足国际化业务需求。整站布局合理,充分展示企业产品、案例与服务,帮助访客快速了解企业核心优势。查看源码
分享笔记 (共有 篇笔记)
验证码:

本栏推荐