dedecms商品模板如何自定义？-网站模板-锦华智联科技

DedeCMS 的“商品”本质上是自定义模型“文章”的一种，我们通过创建一个“商品”模型，为它添加特定的字段（如价格、库存、型号等），然后就可以使用 DedeCMS 强大的模板引擎来灵活地展示这些商品。

（图片来源网络，侵删）

下面我将从零开始,详细讲解如何创建和使用 DedeCMS 的商品模板。

核心概念：商品 = 自定义模型 + arclist

在 DedeCMS 中，一个“商品”通常包含以下要素：

主表（archives）：存储所有内容的通用信息，如标题（title）、发布时间（pubdate）、点击量（click）、缩略图（litpic）等。
附加表（addonarticle）：这是关键！当我们创建一个“商品”模型时，DedeCMS 会自动创建一个对应的附加表，我们在这个表里添加商品特有的字段，
- 价格 (price)
- 商品编号 (productno)
- 库存 (stock)
- 品牌 (brand)
- 规格参数 (specs)
- 商品详情（可以直接用文章的 body 字段，或者单独建一个字段）
模板（.htm 文件）：使用 DedeCMS 的模板标签（如 {dede:arclist}）来循环调用附加表中的字段，从而在页面上展示商品信息。

创建商品模型的详细步骤

第1步：创建自定义模型

登录 DedeCMS 后台。
进入 【核心】 -> 模型管理】。
点击右上角的 模型】。
填写模型信息：
- 模型名称：填写 商品 或 Product。
- 表前缀：系统会自动生成，如 dede_addonshop，无需修改。
- 附加表字段：勾选你需要的系统字段，或者稍后在模型管理中添加。
- 列表命名规则：可以使用默认的 {typedir}/list_{tid}_{page}.html。
- 文章命名规则：可以使用默认的 {typedir}/{aid}.html。
点击 【确定】。

第2步：为模型添加自定义字段

在 模型管理】 列表中，找到你刚刚创建的“商品”模型，点击后面的 【字段管理】。
点击 【增加新字段】。
为商品添加常用字段：
- 字段名：price (必须小写，不含特殊字符)
- ：商品价格
- 字段类型：数字
- 默认值：0
- 是否为空：是
- 保存后，继续添加其他字段：
  - 字段名：productno，：商品编号，字段类型：单行文本
  - 字段名：stock，：库存数量，字段类型：数字
  - 字段名：brand，：品牌，字段类型：单行文本
  - 字段名：sales，：销量，字段类型：数字
  - 字段名：guige，：规格，字段类型：文本区域 (适合存储多行规格)
- 重要：添加完所有字段后，务必点击页面底部的 【保存字段】 按钮。

第3步：创建商品栏目

进入 【核心】 -> 【栏目管理】。
点击 【增加顶级栏目】。
填写栏目信息：
- 栏目名称：商品中心 或某个具体分类，如 手机数码。
- 栏目类型：选择 【栏目目录】。
- 内容模型：务必选择你刚刚创建的【商品】模型。
- 其他选项：如列表模板、文章模板等可以先使用默认的，稍后我们再修改。
点击 【确定】，你可以继续为这个栏目创建子栏目（如手机、电脑），子栏目也要选择“商品”模型。

第4步：发布商品内容

进入 【核心】 -> 发布】 -> 】。
选择你刚才创建的“商品”栏目。
在发布页面,你会看到除了常规的标题、作者、缩略图等，还有你自定义的 商品价格、商品编号、库存 等字段，请填写这些信息。
填写完成后,点击 【发布】 或 【保存】。

制作商品模板文件

我们开始制作模板来展示这些商品,模板文件通常放在 /templets/default/ 目录下。

商品列表页模板 (list_栏目ID.htm)

这个模板用于展示一个栏目下的所有商品,/templets/default/list_1.htm。

（图片来源网络，侵删）

示例代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">{dede:field.seotitle/}_{dede:global.cfg_webname/}</title>
</head>
<body>
    <h1>{dede:field.typename/}</h1>
    <div class="product-list">
        {dede:arclist 
            typeid='1' 
            row='8' 
            titlelen='30' 
            orderby='pubdate' 
            channelid='1' 
            addfields='price,productno,brand'
        }
        <div class="product-item">
            <!-- 商品缩略图 -->
            <a href="[field:arcurl/]">
                <img src="[field:litpic/]" alt="[field:title/]" />
            </a>
            <!-- 商品标题 -->
            <h3><a href="[field:arcurl/]">[field:title/]</a></h3>
            <!-- 自定义字段调用 -->
            <p>品牌：[field:brand/]</p>
            <p>价格：¥ [field:price/]</p>
            <p>编号：[field:productno/]</p>
        </div>
        {/dede:arclist}
    </div>
</body>
</html>

{dede:arclist} 标签关键参数说明：

typeid='1'：指定调用哪个栏目的商品，如果是顶级栏目，调用其所有子栏目的商品，可以用 typeid='top'。
row='8'：每页显示8个商品，len='30'`：标题最多显示30个字符。
channelid='1'：非常重要！ 指定调用哪个模型的内容。1 通常是“商品”模型的ID，你可以在后台的【内容模型管理】中查看。
addfields='price,productno,brand'：非常重要！ 告诉标签需要从附加表中取出哪些自定义字段，必须在这里声明，才能在模板中使用 [field:price/] 这样的语法。

商品详情页模板 (article_article.htm)

这个模板用于展示单个商品的详细信息,/templets/default/article_article.htm。

示例代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">{dede:field.title/}_{dede:global.cfg_webname/}</title>
</head>
<body>
    <div class="product-detail">
        <h1>{dede:field.title/}</h1>
        <div class="product-info">
            <div class="product-img">
                <img src="{dede:field name='litpic'/}" alt="{dede:field.title/}" />
            </div>
            <div class="product-meta">
                <p><strong>品牌：</strong>{dede:field.brand/}</p>
                <p><strong>商品编号：</strong>{dede:field.productno/}</p>
                <p><strong>市场价：</strong><del>¥ 9999</del></p>
                <p><strong>销售价：</strong><span class="price">¥ {dede:field.price/}</span></p>
                <p><strong>库存：</strong>{dede:field.stock/} 件</p>
                <p><strong>销量：</strong>{dede:field.sales/} 件</p>
                <p><strong>规格：</strong>{dede:field.guige function='nl2br(@me)'/}</p>
                <!-- 这里可以加入购买按钮 -->
            </div>
        </div>
        <div class="product-content">
            <h2>商品详情</h2>
            {dede:field.body/}
        </div>
    </div>
</body>
</html>

{dede:field} 标签说明：

在详情页中,直接使用 {dede:field.字段名/} 即可调用文章主表或附加表中的字段。
{dede:field.title/} 调用标题，{dede:field.price/} 调用我们自定义的价格。
{dede:field.body/} 调用文章正文内容。
对于文本区域（如 guige），可以使用 function='nl2br(@me)' 来将换行符 <br> 转换为 HTML 换行标签，使显示更美观。

常用技巧与注意事项

channelid 和 addfields 必须配对使用：在任何调用商品列表的地方，只要涉及到自定义字段，这两个参数都不能少，否则会调用失败或显示为空。

使用 channelartlist 做分类导航：如果你的首页需要展示所有商品分类及其下的商品，可以使用 channelartlist 标签。

{dede:channelartlist typeid='top'}
    <h2>{dede:typename/}</h2>
    <div class="sub-products">
        {dede:arclist row='4' titlelen='20' channelid='1' addfields='price'}
            <a href="[field:arcurl/]">[field:title/]</a> - ¥[field:price/]
        {/dede:arclist}
    </div>
{/dede:channelartlist}

图片处理：DedeCMS 的 [field:litpic/] 默认调用的是缩略图，如果商品没有上传缩略图，它会调用文章的第一张图，如果都没有，则为空，可以通过CSS设置默认占位图。
性能优化：arclist 在调用大量数据时可能会有性能瓶颈，对于大型商城，建议考虑更专业的电商系统（如 EcShop, ShopEX 等），它们对商品、订单、支付等有更完善的处理。
模板命名规则：确保你的模板文件名（如 list_1.htm）与后台栏目设置的“列表命名规则”和“文章命名规则”一致。

DedeCMS 的商品模板系统虽然需要一些前期配置（创建模型、字段、栏目），但一旦配置完成，其模板的灵活性非常高，可以让你完全控制商品的展示样式，核心要点就是：

创建“商品”模型，并添加所需字段。
使用 {dede:arclist} 调用商品列表，并务必带上 channelid 和 addfields 参数。
使用 {dede:field} 在详情页中调用商品信息。

希望这份详细的指南能帮助你成功搭建起 DedeCMS 的商品展示系统！