图文列表调用方式

第一步：设置栏目标识`news1，news2，news3，news4，news5、`可选中，一般设置了5个标尺
第二步：前端调用我这选用的是`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.time|date="Y-m-d H:s",###}
Y年 m月 d日 H时 s分  -可以替换其他`

速建时代TPCMS管理系统

图文列表调用方式