4-如何灵活使用筛选标签
# 创建筛选字段
【系统管理】-【模型管理】-【DIY产品】-【字段管理】
一般创建单选或下拉框类型的字段，并记住id编号，例如下图为131,132,133,137
# 前端代码调用
`group`意思是将对应字段进行关联筛选
```
<div class="container">
<div class="sort">
<dl>
<dt><strong>一年费用</strong></dt>
<dd>
<p><yunu:field id="131" group="131,132,133,137" noset="true" active="active"><a href="{$field.url}" class="{$field.active}">{$field.name}</a></yunu:field> </p>
</dd>
</dl>
<dl>
<dt><strong>学校类型</strong></dt>
<dd>
<p> <yunu:field id="132" group="131,132,133,137" noset="true" active="active"><a href="{$field.url}" class="{$field.active}">{$field.name}</a></yunu:field> </p>
</dd>
</dl>
<dl>
<dt><strong>学校位置</strong></dt>
<dd>
<p><yunu:field id="133" group="131,132,133,137" noset="true" active="active"><a href="{$field.url}" class="{$field.active}">{$field.name}</a></yunu:field></p>
</dd>
</dl>
<dl>
<dt><strong>学校特色</strong></dt>
<dd>
<p><yunu:field id="137" group="131,132,133,137" noset="true" active="active"><a href="{$field.url}" class="{$field.active}">{$field.name}</a></yunu:field></p>
</dd>
</dl>
</div>
```
```
<ul class="list-4">
<yunu:list cid="$cid" sql="131 and 132 and 133 and 137" pagesize="8">
<li class="wow fadeInUp"> <a href="{$list.url}" title="{$list.title}">
<div class="img-center"><img src="<if condition="$list['pic']">{$list.pic}<else/>{$list.content|str2img='1'}</if>" onerror="javascript:this.src='__PUBLIC__/images/nopic.jpg';" alt="{$list.title}"></div>
<div class="text">
<h4>{$list.title}<small>{$list.ename}</small></h4>
<div class="add">{$list.weizhi}</div>
<div class="tag"> <yunu:tag title="$list['tag']"><span>{$tag.title}</span></yunu:tag> </div>
<div class="price">
<p>AP课程<span>{$list.num}</span></p>
<p>年度费用<span>{$list.feiyong}</span></p>
</div>
<div class="more">查看更多</div>
</div>
</a> </li>
</yunu:list>
</ul>
<div class="pages">{$page}</div>
```
# 最终显示效果如下
