下面我将从文件位置、核心代码、常用标签以及实例四个方面进行详细说明。
（图片来源网络，侵删）
模板文件位置
DedeCMS 的模板文件存放在 /templets/ 目录下，对于商城列表页，其模板通常位于：
/templets/你的默认模板文件夹/
├── list_product.htm <-- 这是商品列表页的主模板文件
├── list_category.htm <-- 这是分类列表页模板（通常也用于商品分类）
├── ...
└── shop/ <-- 如果是独立商城模块，模板可能放在这里
└── list.htm如何确定使用哪个文件？
当你通过后台访问一个商品分类列表页时，DedeCMS 会根据你设置的“默认模板风格”去寻找对应的 list_product.htm 文件，如果找不到，可能会使用默认的 list.htm。
核心代码结构
一个标准的商品列表页模板 (list_product.htm) 通常包含以下几个部分：
- 头部：引入公共头部文件，包含网站标题、导航栏、搜索框等。
- 面包屑导航：显示当前分类的层级路径，方便用户知道自己在哪。
- 筛选条件：价格区间、品牌、属性等筛选条件。
- 排序方式：按价格、销量、上架时间等排序。
- 商品列表主体：循环输出每个商品的信息，这是最核心的部分。
- 分页导航：实现翻页功能。
- 底部：引入公共底部文件，包含页脚信息、友情链接等。
常用核心标签
在列表模板中,你需要熟练使用以下 DedeCMS 标签：
（图片来源网络，侵删）
列表循环标签 ({dede:arclist})
这是用来循环输出商品列表的核心标签,在商城系统中，它会根据当前分类自动筛选商品。
基本语法：
{dede:arclist typeid='当前分类ID' row='10' titlelen='30' orderby='pubdate'}
<!-- 循环体内的HTML代码 -->
{/dede:arclist}
常用属性：
| 属性名 | 说明 | 示例 |
|---|---|---|
typeid |
指定栏目ID，在列表页中，通常不需要手动填写，它会自动获取当前分类的ID。 | typeid='8' |
row |
获取记录的条数，即每页显示多少个商品。 | row='12' |
infolen |
内容摘要长度。 | infolen='120' |
orderby |
排序方式，常用值：pubdate(发布时间), hot(点击量/人气), sales(销量), id(ID), rand(随机)。 |
orderby='sales' |
orderway |
排序方式。desc 降序（从大到小），asc 升序（从小到大）。 |
orderway='desc' |
channelid |
指定模型ID，商城商品通常是 16 或 17，需要根据你后台的模型设置为准。 |
channelid='16' |
addfields |
额外调用字段，如果要在列表页调用商品的价格、图片等，需要在这里指定。 | addfields='price,shopprice,goodspic' |
循环内部字段标签
在 {dede:arclist}...{/dede:arclist} 之间，使用 field: 来获取当前商品的各个字段信息。
（图片来源网络，侵删）
| 字段标签 | 说明 | 示例 |
|---|---|---|
[field:title/ |
。 | <a href="[field:arcurl/]">[field:title/]</a> |
[field:arcurl/ |
商品的详细页链接URL。 | <a href="[field:arcurl/]"> |
[field:litpic/ |
商品的缩略图（通常是列表图）。 | <img src="[field:litpic/]" alt="[field:title/]"> |
[field:price/ |
商品的市场价。 | 市场价: ¥[field:price/] |
[field:shopprice/ |
商品的销售价（商城价）。 | 商城价: <strong>¥[field:shopprice/]</strong> |
[field:goodspic/ |
商品相册的第一张图（litpic 为空则调用此图）。 |
<img src="[field:goodspic/]" alt="[field:title/]"> |
[field:click/ |
商品的点击量。 | 浏览: [field:click/] |
[field:pubdate function='MyDate('Y-m-d', @me)'/ |
商品发布时间，使用函数格式化。 | 发布时间: [field:pubdate function='MyDate('Y-m-d', @me)'/] |
分页标签 ({dede:pagelist})
用于生成分页导航。
基本语法：
<div class="dede_pages">
<ul>
{dede:pagelist listsize='5' listitem='info,index,end,pre,next,pageno'}
{/dede:pagelist}
</ul>
</div>
常用属性：
| 属性名 | 说明 | 示例 |
|---|---|---|
listsize |
显示的页码数量。 | listsize='3' |
listitem |
显示的分页项目。info(信息条), index(首页), pre(上一页), next(下一页), pageno(页码), end(末页)。 |
listitem='index,pre,next,end' |
面包屑导航标签 ({dede:position})
显示当前位置。
基本语法：
<div class="position">
<a href="{dede:global.cfg_cmsurl/}/">首页</a> > {dede:position/}
</div>
完整实例代码
下面是一个功能相对完整的商品列表页模板 (list_product.htm) 示例：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">{dede:field.title/} - {dede:global.cfg_webname/}</title>
<meta name="description" content="{dede:field.description function='html2text(@me)'/}" />
<!-- 引入CSS文件 -->
<link rel="stylesheet" href="/templets/你的默认模板文件夹/css/style.css">
</head>
<body>
<!-- 引入公共头部 -->
{dede:include filename="header.htm"/}
<!-- 面包屑导航 -->
<div class="breadcrumb">
<div class="container">
<a href="{dede:global.cfg_cmsurl/}/">首页</a>
<span class="separator">></span>
{dede:position runphp='yes'}
$tcarr = array(' > ');
$twarr = explode('<a', $GLOBALS['arrlist'][1]['url']);
$twarr = explode('>', $twarr[1]);
$twarr = str_replace('</a', '', $twarr[1]);
$GLOBALS['revalue'] = str_replace($tcarr, ' > ', $twarr);
{/dede:position}
</div>
</div>
<div class="main-content container">
<div class="page-title">
<h1>{dede:field.title/}</h1>
</div>
<!-- 筛选和排序区域 (示例，实际需要根据商城逻辑实现) -->
<div class="filter-bar">
<div class="sort">
<span>排序：</span>
<a href="{dede:global.cfg_phpurl/}/list.php?tid={dede:field.id/}&orderby=pubdate">默认</a>
<a href="{dede:global.cfg_phpurl/}/list.php?tid={dede:field.id/}&orderby=sales">销量</a>
<a href="{dede:global.cfg_phpurl/}/list.php?tid={dede:field.id/}&orderby=shopprice&orderway=asc">价格从低到高</a>
<a href="{dede:global.cfg_phpurl/}/list.php?tid={dede:field.id/}&orderby=shopprice&orderway=desc">价格从高到低</a>
</div>
</div>
<!-- 商品列表主体 -->
<div class="product-list">
<ul class="row">
{dede:arclist
typeid=''
row='12'
titlelen='30'
orderby='pubdate'
orderway='desc'
addfields='price,shopprice,goodspic'
}
<li class="col-md-3 col-sm-6">
<div class="product-item">
<div class="product-img">
<!-- 如果缩略图为空，则调用相册图 -->
<a href="[field:arcurl/]">
<img src="[field:litpic/]" onerror="this.src='/templets/你的默认模板文件夹/images/default.jpg'" alt="[field:title/]">
</a>
</div>
<div class="product-info">
<h3 class="product-title">
<a href="[field:arcurl/]">[field:title/]</a>
</h3>
<div class="product-price">
<span class="price-market">¥[field:price/]</span>
<span class="price-sale">¥[field:shopprice/]</span>
</div>
</div>
</div>
</li>
{/dede:arclist}
</ul>
</div>
<!-- 分页导航 -->
<div class="pagination">
{dede:pagelist listsize='5' listitem='index,pre,next,end,pageno'}
{/dede:pagelist}
</div>
</div>
<!-- 引入公共底部 -->
{dede:include filename="footer.htm"/}
<!-- 引入JS文件 -->
<script src="/templets/你的默认模板文件夹/js/jquery.min.js"></script>
</body>
</html>
常见问题与注意事项
-
商品不显示：
- 检查
{dede:arclist}的typeid是否正确，或者是否为空（空表示全站）。 - 检查
channelid是否与后台商品模型的ID一致。 - 检查商品是否在正确的分类下,并且是“审核通过”状态。
- 检查
addfields是否包含了你需要调用的自定义字段（如shopprice）。
- 检查
-
价格显示不出来：
- 确认你在后台发布商品时,已经填写了“市场价”和“商城价”这两个字段。
- 检查
addfields属性是否包含了price和shopprice。
-
图片显示不出来：
- 检查商品是否有上传缩略图 (
litpic)。 - 检查
<img>标签的src路径是否正确，并确保服务器上的图片文件存在。 - 可以添加
onerror属性来设置一个默认图片，如示例中的onerror="this.src='/images/default.jpg'"。
- 检查商品是否有上传缩略图 (
-
排序不生效：
- 排序链接需要指向正确的URL,通常是通过
list.php并带上orderby和orderway参数。 - 检查后台的“系统参数” -> “核心设置” 中，是否开启了“使用动态页面”选项，如果开启，链接会是动态的（
?tid=xx&orderby=xx），否则是静态的（/list/xx.html），需要相应调整链接写法。
- 排序链接需要指向正确的URL,通常是通过
希望这份详细的指南能帮助你理解和制作 DedeCMS 的商品列表模板！
