模板手册
使用手册
模板手册
常见问题
模板助手
快速开始
目录结构
简介
模板设计
制作流程
模板设计师
文件及目录
目录机构
模板设计师
模板引擎
标签参考
搜索标签
全局标签
内容标签
图文标签
列表标签
首页标签
模板扩展
自定义分页
自定义表格列表
定义页面标签
标签参考/图文标签
[TOC] # 图文列表标签 ### 设置标尺 >注意:1.标尺不能重复 2.页面属性只能位列表否者无法发文操作 4.同类标尺不能大于10个 ![](http://sjsdxg.oss-cn-hongkong.aliyuncs.com/img/2022-08-01/%E7%BD%91%E9%A1%B5%E6%8D%95%E8%8E%B7_1-8-2022_163549_wxadmin.hbsjsd.cn.jpeg) 第一步:设置栏目标识`news1,news2,news3,news4,news5、`可选中,一般设置了10个标尺 第二步:前端调用我这选用的是`news1`使用方式如下 ```html {volist name="news1" id="vo" offset="0" length='6'} <div class="col-md-6 col-sm-4 col-12"> <div class="content imghvr-fade"> <img {if condition="$vo['pic'] eq ''" }src="{$temp_css}/images/work1.jpg" {else/}src='{$vo.pic}'{/if} alt=""> <a href="{:url('Article/index',array('aid'=>$vo['id']))}"> <div class="caption"> <h6>{$vo.title}</h6> <p>{$vo.description|delhtml=###|cut_str="100"}</p> </div> </a> </div> </div> {/volist} ``` 显示条数 `length` A链接`{:url('Article/index',array('aid'=>$vo['id']))}` 循环区域` {volist name="news1" id="vo" offset="0" length='6'}{/volist}` 图片调用`{if condition="$vo['pic'] eq ''" }src="{$temp_css}/images/work1.jpg" {else/}src='{$vo.pic}'{/if}` `{if condition="$vo['pic'] eq ''" }`if判断图片是否为空,如何为空显示默认图片,否则显示上传的图片 `{:url('Article/index',array('aid'=>$vo['id']))}`A标签链接Article/index跳转方法模型 $vo['id']为文章ID `{$vo.content|delhtml=###|cut_str="100"}` `description`对应数据表内容,可以替换其他字段,`delhtml`为去除内容中HTML标签 ,`cut_str`为显示字数 [其他字段详情》》](http://help.hbsjsd.cn/art/list/14.html "其他字段详情》》") 特殊字段日期调用方式`{$vo.time|date="Y-m-d H:s",###} Y年 m月 d日 H时 s分 -可以替换其他` ------------ ### 案例普通列表显示 ```html {volist name="news1" id="vo" offset="0" length='6'} <div class="col col-sm-12 col-12 col-md-4"> <div class="content"> <img {if condition="$vo['pic'] eq ''" }src="{$temp_css}/images/blog3.jpg" {else/}src='{$vo.pic}'{/if} alt="{$vo.title}" class="w-100"> <div class="content-text"> <h5><a href="{:url('Article/index',array('aid'=>$vo['id']))}">{$vo.title}</a></h5> <span>{$vo.time|date="Y-m",###}</span> <p class="mb-0">{$vo.content|delhtml=###|cut_str="50"}</p> </div> </div> </div> {/volist} ``` 显示条数 `length` A链接`{:url('Article/index',array('aid'=>$vo['id']))}` 循环区域` {volist name="news1" id="vo" offset="0" length='6'}{/volist}` 图片调用`{if condition="$vo['pic'] eq ''" }src="{$temp_css}/images/work1.jpg" {else/}src='{$vo.pic}'{/if}` `{if condition="$vo['pic'] eq ''" }`if判断图片是否为空,如何为空显示默认图片,否则显示上传的图片 `{:url('Article/index',array('aid'=>$vo['id']))}`A标签链接Article/index跳转方法模型 $vo['id']为文章ID `{$vo.content|delhtml=###|cut_str="100"}` `description`对应数据表内容,可以替换其他字段,`delhtml`为去除内容中HTML标签 ,`cut_str`为显示字数 [其他字段详情》》](http://help.hbsjsd.cn/art/list/14.html "其他字段详情》》") 特殊字段日期调用方式`{$vo.time|date="Y-m-d H:s",###} Y年 m月 d日 H时 s分 -可以替换其他` ###返回值 ```json 数组模式返回需要使用上门循环语句显示 0 => array:21 [ "id" => 9 "cate_name" => "帮助中心" "title" => "" //栏目名称 "keywords" => ""//关键词 "desc" => ""//描述 "content" => ""//内容 "status" => 1//审核状态 "jump_id" => 0//是否跳转 "img" => ""//封面图 "cate_attr" => 1 //栏目类型 1列表页 2单页 3跳转 使用类型2【/index_tmp】类型 【list_tmp】【article_tmp】无效 ,使用类型3【/article_tmp】者【index_tmp】【index_tmp】无效 "list_tmp" => "list_article.html" //跳转列表页 "index_tmp" => "index_article.html" //单页地址 "article_tmp" => "article_article.html" //内容页 "link" => ""//类型3跳转页 "sort" => 50//栏目排序 "model_id" => 1 "bottom_nav" => 0//是否底部显示0显示1不显示 "pid" => 0//顶级栏目标识 0为顶级 "mark" => "" "thumb" => 1 "uid" => 1 ] ```