产品页面

电子商务产品页面会展示相关产品的所有产品详细信息和媒体项。您可以自定义 图像和视频部分、选择 要显示哪些产品信息、显示特定的 按钮、自定义 属性详情部分、启用 其他组织功能,并使用 构建块 添加内容。

产品图片和视频

在 产品表单上添加媒体项 后,或在前端 创建产品 时,可在前端产品页面上对其进行自定义。为此,请打开在线商店中的相关产品页面,点击右上角的 编辑,然后进入 样式 选项卡。

小技巧

要从后端的 产品表单 访问相关产品页面,请点击表单顶部的 前往网站 智能按钮。

要管理单个媒体项,请在产品页面上点击该项,然后向下滚动到网站编辑器的 图像 部分。接着,您可以 替换 或 移除 图像或视频,并 重新排序 各项。使用 (left double arrow) 或 (right double arrow) 可将媒体移动到第一个或最后一个位置,使用 (left arrow) 或 (right arrow) 可将其移动一个位置。

要调整图像和视频部分的布局,请转到 图像区域 并定义图像的大小和 位置。接着,进入 图像 部分,使用以下选项自定义此部分:

  • 主图像:点击 替换 更改产品主图像。

    注解

    无法将视频用作主要媒体项。

  • 额外媒体:添加更多 图像或视频(包括通过 URL),或 全部移除 媒体项。

  • 显示:当使用多个媒体项时,可在以下布局中进行选择:

    • 轮播:此选项允许访客使用 (left arrow) 或 (right arrow) 从一张图像切换到下一张图像。可在 (Left) 上或 (Bottom) 处显示 缩略图,并调整图像的边角 圆角。

    • 网格:此布局以方形排列显示媒体项。如有必要,可调整 列 的数量,并定义网格中图像之间的 间距。

  • 自动裁剪:选择一种尺寸来裁剪图像以匹配页面布局。在设计 Mobile 布局 时,此选项非常有用。

  • 点击缩放:当访客点击图像时启用图像缩放。

页面布局和产品信息显示

要自定义产品页面的布局,请打开任意产品页面,点击右上角的 编辑,然后进入 样式 选项卡。接着,转到 页面宽度 设置,选择 常规 或 全宽 选项。

小技巧

您可以为 商店页面 选择不同的宽度。

使用 产品详情 部分中提供的选项,选择在产品页面上显示哪些产品信息。您可以配置 按钮、定义 属性的显示方式、使用 页面自定义功能 组织页面,并使用 构建块 添加内容。

按钮

使用以下选项自定义产品页面上显示的按钮:

属性

选择产品 属性 在产品页面的 规格 部分中的显示方式:

  • 无:不显示详细信息。

  • 页面底部:在页面底部显示详细信息。

  • 在折叠面板中:在订购选项正下方显示可折叠的表格。

注解

仅当启用 产品变体 且已为产品定义至少一个属性时,才会显示规格部分。

小技巧

页面组织选项和其他功能

开启或关闭以下选项,以在所有产品页面上启用或禁用相应功能:

  • 分隔符:组织页面并提升视觉清晰度。

  • 税务指示:标明价格是 含税还是不含税。

  • 标签:在产品页面上显示在 后端 中创建的标签,并让客户能够按这些标签筛选产品。

  • 条款与条件:显示指向您的 条款与条件 的链接。

  • 评论:允许 已登录的门户用户 提交产品评价。要添加评价,用户必须转到页面底部的 客户评价 部分,并点击 (plus) 图标。然后他们可以使用 (star) 图标选择评分并留下评论。 (star) 评分会直接显示在产品名称下方。

  • 搜索栏:显示一个可独立于 商店页面 显示或隐藏的搜索栏。

  • Ribbon (或徽标):突出显示特定产品。

小技巧

您还可以启用其他功能,并显示先前在后端中配置的信息:

  • 线上下单 & 线下取货:在产品页面上显示订单自提地点和配送可用情况,并允许客户选择所需的自提点。

  • 描述:在产品名称正下方显示电子商务专用的产品描述。

  • 包装:提供不同类型的包装。

  • 文档:添加相关文档,例如用户手册或其他辅助材料。

  • 替代产品:推荐类似产品并自定义该部分。

  • 显示可用数量:当数量低于指定阈值时显示产品的可用数量。

  • 缺货消息:为缺货产品显示自定义消息。

  • 补货时收到通知:客户可以填写电子邮件地址,以便在商品补货时收到通知。

  • 产品页面额外字段:要为产品页面启用特定的额外字段,请启用 开发者模式。然后转到 网站 ‣ 配置 ‣ 网站,选择相关网站,进入 产品页面额外字段 选项卡,并在 字段 下点击 添加行,按需添加任意数量的额外字段,例如产品的条形码编号。

构建模块

使用构建块为所有产品页面或某个特定产品页面添加内容和设计元素。为此,请打开任意产品页面或相关产品页面,然后点击右上角的 编辑。接着,在 (plus) 块 选项卡中选择一个构建块,并将其拖放到:

  • 拖放到产品页面顶部或底部的蓝色区域,使其在 所有 产品页面上可用,或

  • 拖放到产品标题下方或订购选项下方的蓝色构建块区域,使其仅对当前产品显示。

在产品页面上拖放构建块。

注解

这些构建块不会显示在 商店页面 上。

另请参阅

网页设计