基本标签使用
{eyou:goodssalesranking row='10' id='field'}
<!-- 标签内容 -->
{/eyou:goodssalesranking}
### 属性说明
属性 类型 默认值 说明
row 数字 10 显示的商品数量
loop 数字 - 同 row ,用于兼容旧版本
id 字符串 field 循环变量名
key 字符串 i 循环索引变量名
ordermode 排序属性 -无此属性则默认高到底
- desc :降序,展示销量从高到低
- asc :升序,展示销量从低到高
mod 数字 2 循环取模值,用于奇偶行样式
empty 字符串 - 数据为空时显示的内容
### 数据字段
字段名 类型 说明
product_id 数字 商品id
Isales_num 数字 商品销量
title 字符串 商品标题
litpic 字符串 商品图片
arcurl 字符串 商品详情链接
====使用示例===
{eyou:goodssalesranking row='5' id='field'}
<div class="sales-ranking-item">
<div class="rank-number">{$i}</div>
<a href="{$field.arcurl}" target="_blank">
<img src="{$field.litpic}" class="goods-image">
<div class="goods-info">
<h5>{$field.title}</h5>
<p>销量:{$field.sales_num} 件</p>
</div>
</a>
</div>
{/eyou:goodssalesranking}
带空数据提示的示例:
{eyou:goodssalesranking row='10' empty='暂无销量数据' id='field'}
<!-- 销量排行展示 -->
{/eyou:goodssalesranking}
3.1 热销商品(默认降序)
{eyou:goodssalesranking row='5' id='field'}
<!-- 展示内容 -->
{/eyou:goodssalesranking}
3.2 明确指定降序
{eyou:goodssalesranking row='10' ordermode='desc' id='field'}
<!-- 展示内容 -->
{/eyou:goodssalesranking}
3.3 销量最低的商品(升序){eyou:goodssalesranking row='5' ordermode='asc' id='field'}
<!-- 展示内容 -->
{/eyou:goodssalesranking}
<h2>Top 5 热销商品(降序 - 默认)</h2>
{eyou:goodssalesranking row='5' id='field'}
<div style="margin: 10px 0; padding: 10px; border: 1px solid #ddd;">
<div style="display: flex; align-items: center;">
<div style="font-size: 24px; font-weight: bold; margin-right: 20px; color: #f00;">{$i}</div>
<a href="{$field.arcurl}" target="_blank" style="text-decoration: none; color: #333;">
<div style="display: flex; align-items: center;">
<img src="{$field.litpic}" style="width: 80px; height: 80px; margin-right: 15px;" alt="{$field.title}">
<div>
<h3 style="margin: 0; font-size: 16px;">{$field.title}</h3>
<p style="margin: 5px 0 0 0; color: #666;">销量:{$field.sales_num} 件</p>
</div>
</div>
</a>
</div>
</div>
{/eyou:goodssalesranking}
<h2>Top 10 热销商品(降序)</h2>
{eyou:goodssalesranking row='10' ordermode='desc' empty='暂无销量数据' id='field'}
<div style="margin: 5px 0; padding: 5px; border-bottom: 1px solid #eee;">
<span style="font-weight: bold; margin-right: 10px;">{$i}.</span>
<a href="{$field.arcurl}" target="_blank">{$field.title}</a>
<span style="margin-left: 10px; color: #999;">销量:{$field.sales_num} 件</span>
</div>
{/eyou:goodssalesranking}
<h2>销量最低的 5 个商品(升序)</h2>
{eyou:goodssalesranking row='5' ordermode='asc' empty='暂无销量数据' id='field'}
<div style="margin: 10px 0; padding: 10px; border: 1px solid #ddd;">
<div style="display: flex; align-items: center;">
<div style="font-size: 24px; font-weight: bold; margin-right: 20px; color: #999;">{$i}</div>
<a href="{$field.arcurl}" target="_blank" style="text-decoration: none; color: #333;">
<div style="display: flex; align-items: center;">
<img src="{$field.litpic}" style="width: 80px; height: 80px; margin-right: 15px;" alt="{$field.title}">
<div>
<h3 style="margin: 0; font-size: 16px;">{$field.title}</h3>
<p style="margin: 5px 0 0 0; color: #666;">销量:{$field.sales_num} 件</p>
</div>
</div>
</a>
</div>
</div>
{/eyou:goodssalesranking}
本文地址:https://www.xuncms.com/doc/5782.html 复制链接
如果还有疑问,欢迎加入我们的QQ交流群:23788716 加入Q群
易优最新程序下载: 点击下载