适用于 Supply 的技巧

本文概述了一些可帮助您设置在线商店的 Supply 的有用提示和最佳做法。

图片提示

产品图片

分辨率更高的照片在 Supply 中看起来更加精致和专业,因此图片至少应为 1024 × 1024 像素。必要时,图片将自动缩小。如果您在产品页面上启用图片缩放,那么具有更高分辨率的照片尤为重要。

产品照片的最佳宽高比是正方形。

缩小幻灯片

若要使幻灯片在主页上占用较少的垂直空间,您应使用横向图片,这些图片的宽度大于高度。您应上传宽度为 1000px 的图片,这样一来,幻灯片在较大显示屏上的左右两侧没有任何空白区域。宽度较小的图片居中显示在幻灯片中。

标头提示

如果标头太高,您可以通过调整 logo 来缩短标头。如果您的 logo 太大,您可以通过调整最大宽度来缩小其尺寸。您的 logo 可能还包含添加到标头上方和下方空白区域的不可见或白色像素。您可以使用 Photoshop 等图片编辑软件从 logo 图片中修剪这些像素。修剪 logo 后,重新上传 logo。修剪 logo 图片中的空白区域可以显著降低标头高度。

  1. 单击标头
  2. 自定义 logo 宽度(以像素为单位) 字段中输入新的宽度。默认像素值为 305。使用较小的像素值可缩小 logo 的大小,从而降低标头的高度。减小 logo 的宽度也会降低其高度,因为 logo 会缩小,同时保留其比例。
  3. 点击保存

网站地图提示

以下提示可帮助您改进使用 Supply 时商店的网站地图体验。

添加下拉菜单

若要在您的主菜单中添加下拉菜单,需要在导航页面上创建菜单

主菜单最佳做法

如果主菜单中的项目太多,无法放在同一行上,则最后无法放入的链接会被添加到更多下拉菜单中。

此行为不受主菜单中链接数量的严格控制,但将链接数量控制在五或六个会有所帮助。要包含更多链接,您可以执行以下操作:

  • 使您的网站导航链接更小。这些链接的字号由字体设置中的主菜单字号控制。
  • 对每个链接使用较少的字符。例如,您可以将“常见问题解答”更改为“FAQ”,将“联系我们”更改为“联系”,将“产品目录”更改为“商店”,并将出现的所有“和”更改为“&”。

网站地图中包含太多项目可能会使您的网站难以使用。若菜单项太多,您的客户可扫描过去的重要项目。尝试将网站地图限制为五个或六个项目。如果要提供对超过六个页面的访问,请使用下拉菜单。

您应该避免从主菜单向每个产品系列添加链接。相反,请尝试在“商店”或“目录”链接下的下拉菜单中列出产品系列。您还可以将产品系列分解为组,并为每个组提供一个下拉菜单。或者,您可以使用产品标签来创建产品的子类别

删除侧边栏

要从商店中删除侧边栏,您需要在两个模板文件中添加一些代码。

  1. Sections 目录中,单击 collection-template.liquid

  2. 在文件中查找 has_sidebar。删除以下代码行:

{% if collection.all_tags.size > 0 %}
  {% assign has_sidebar = true %}
{% endif %}
  1. 点击保存

  2. Sections 目录中,单击 collection-list-template.liquid

  3. 在文件中查找 has_sidebar。删除以下代码行:

{% if collection.all_tags.size > 0 %}
  {% assign has_sidebar = true %}
{% endif %}
  1. 点击保存

产品提示

以下提示可帮助您使用 Supply 展示产品。

使用高级组筛选

如果您有许多产品,您可以启用子组来帮助您的客户对产品进行排序。

  1. 定义组。对于相机商店,可以按品牌焦距分辨率来组织分组。

  2. 将所有产品导出为 .csv 文件

  3. 在所有现有标记前面加上您希望它们所在的组的名称,采用 Group_Tag Name 的格式。对于此示例,一些标签将为 Brand_CanonFocal Length_18 - 55mmResolution_12 MP。下划线的左侧是组名称,右侧是产品的标签。下划线的两侧均可包含空格。

  4. 保存 .csv 文件,并将产品重新导入您的商店。确保在上传文件时选择替换具有相同 handle 的任何现有产品,以防止创建重复的产品。

  5. 在产品系列页面上启用按组筛选:

    1. 在 Shopify 后台中,转到在线商店 > 模板
    2. Supply 旁边,点击自定义
    3. 在页面顶部的下拉菜单或模板菜单中,选择产品系列页面
    4. 单击产品系列分区。
    5. 侧边栏产品筛选条件下,选择按组
    6. 点击保存

备注:如果在产品标签内使用单引号、双引号或“&”符号,则分组筛选无法按预期工作。

重新排序筛选器组和标签

组按字母顺序排序,组内列出的标签也按此顺序排序。Shopify 专家可以帮助您自定义订单。

定价提示

以下提示可帮助在使用 Supply 时设置定价。

禁用销售金额的四舍五入

  1. 在左侧的资产下,打开 timber.scss.liquid

  2. 在文件底部,添加以下代码:

.sale-tag sup {
   display: inline;
   top: 0;
   font-size: 100%;

   &:before {
    content: '.';
   }
 }
  1. 点击保存

购物车提示

以下提示可确保将 JavaScript 添加到 Supply 后,您商店的购物车能够正常工作。

更改购物车类型,以便高级 JavaScript 正常运作

在 Supply 中,您添加到 cart.liquid 的任何 JavaScript 都不会在抽屉式或模式购物车中执行。它只会在您将 /cart 追加到商店的 URL 时执行。例如,http://your.store.url/cart

如果您想将以下任何功能添加到购物车页面,则需要将购物车类型设为页面式

  • 运费计算器
  • 多种货币
  • 礼品包装
  • 购物车属性验证
  • 日期选择器
  • “我同意条款”复选框。

步骤:

  1. 点击模板设置
  2. 点击购物车
  3. Cart type(购物车类型)下拉列表中,选择页面
  4. 点击保存

准备好开始使用 Shopify 进行销售了吗?

免费试用