Shopify如何在产品页面上显示SKU

SKU（库存单位）是数字，通常是字母数字，用于帮助识别产品和跟踪库存。如果商店使用SKU，则会为每个单独的产品变型分配一个唯一的编号。您可以通过编辑主题代码在产品页面上显示变体的SKU编号。

在添加任何代码之前，请始终复制主题。如果出现任何问题或将来决定不使用添加的代码，这将为您节省。我们不支持您对主题进行的任何代码更改，也不对此负责。因此，请保存自己并首先进行复制。

接下来，打开代码编辑器：

在主题列表中，找到要编辑的主题的“操作”链接。然后选择编辑代码。示例主题主题：

如果您正在使用主要实时/已发布主题进行操作，例如：

在“片段”文件夹中，打开product.liquid：

在代码区域中，使用“查找”功能（在Mac中为Command-F，在Windows中为Control-F）并搜索：

h1

例：

在以</ h1>结尾的行下方添加几个空白行。然后添加以下代码：

<!-- Code added for SKU -->
{% assign current_variant = product.selected_or_first_available_variant %}
{% if current_variant.sku != "" %}
<p class="text-center uppercase"><span id="sku"></span></p>
{% endif %}
<!-- end SKU -->

例：

保存文件。

修改您的Javascript文件

具体取决于您运行的管道版本：

管道4- 从Assets文件夹中，打开 theme.js

要么

通过Assets 打开shop.js.liquid的Pipeline的早期版本

第1部分

在代码区域中，使用“查找”功能（在Mac上为Command-F，在Windows上为Control-F）并找到：

if (variant.available)

例：

第2部分

添加以下代码上面找到的部分开始：

/* -- code added for SKU -- */
$('#sku').text('SKU: ' + variant.sku);
/* - end - */

示例（theme.js）：

较早版本的管道示例（shop.js）：

（请确保在粘贴代码之前添加几个空白行）。

保存文件。

将SKU信息添加到您的产品页面

在您的产品设置中，更新所有产品以包含SKU编号-在“库存”部分中可以找到此编号：

对于带有变体的产品：

保存产品，您现在应该在网站上产品标题下方看到SKU号。

工作代码示例：

如果我的变体选项是“小/蓝色”，则我的SKU显示：

如果我更改为中/黑色，则我的SKU动态更改为：

如果我有没有变体的产品，但是添加了SKU，它将显示：

最后，如果我的产品没有附加SKU，则不会显示任何内容：

如果您的产品具有变体，请确保所有变体选项均没有SKU或没有。