商品ページにSKU番号を表示する
このページはMar 28, 2024に印刷されています。最新のバージョンについては、https://help.shopify.com/ja/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/show-skuをご覧ください。
SKU (最小管理単位) とは数字 (通常は英数字) であり、商品を識別して在庫を追跡できるようにするために使用されます。ストアでSKUを使用している場合、各商品バリエーションに対して個別に固有の番号が割り当てられます。テーマコードを編集して、商品ページにバリエーションのSKU番号を表示できます。
セクション対応のテーマとセクション非対応のテーマ
セクション対応のテーマの手順
商品ページにSKU番号を表示する
- 管理画面から [オンラインストア] > [テーマ] に移動します。
- 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
-
[セクション] ディレクトリで、
product.liquid
またはproduct-template.liquid
をクリックします。
- 次のLiquidタグを探します。
このコードは、商品ページで商品名をレンダリングします。
-
{{ product.title }}
を含むコード列の下の新しい行に、次のコードを貼り付けます。
-
[保存] をクリックします。
テーマの選択
このカスタマイズの次のステップは、テーマによって異なります。テーマのボタンをクリックし、手順に従ってください。
Boundlessの手順
-
アセットディレクトリーで、
theme.js.liquid
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Brooklynの手順
-
アセットディレクトリーで、
theme.js.liquid
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Debutの手順
-
アセットディレクトリーで、
theme.js
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Expressの手順
-
レイアウトディレクトリーで、
theme.liquid
をクリックします。
-
</body>
終了タグを探します。
-
</body>
終了タグのすぐ上の行に、次のコードを貼り付けます。
-
[保存] をクリックします。
Minimalの手順
-
アセットディレクトリーで、
theme.js
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Narrativeの手順
-
アセットディレクトリーで、
custom.js
をクリックします。
- ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Simpleの手順
-
アセットディレクトリーで、
theme.js.liquid
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Supplyの手順
-
アセットディレクトリーで、
theme.js.liquid
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
Ventureの手順
-
アセットディレクトリーで、
theme.js
をクリックします。
-
variant.sku
を探します。
-
variant.sku
が見つかったなら、カスタマイズは完了です。
-
variant.sku
が見つからなかったなら、次のステップに進みます。
ファイルの下部に以下のコードを貼り付けます。
-
[保存] をクリックします。
管理画面から商品バリエーションにSKU番号を追加する
商品ページにSKUを表示するには、管理画面から商品バリエーションにSKU番号を追加する必要があります。
管理画面から [商品管理] に移動します。
編集する商品をクリックします。
複数のバリエーションがある商品については、[バリエーション] セクションで次のようにSKU番号を追加します。
[保存] をクリックします。
セクション非対応のテーマの手順
商品ページにSKU番号を表示する
手順:
- 管理画面から [オンラインストア] > [テーマ] に移動します。
- 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
-
テンプレートディレクトリーで、
product.liquid
をクリックします。
- 次のLiquidタグを探します。
このコードは、商品ページで商品名をレンダリングします。
-
{{ product.title }}
を含むコード列の下の新しい行に、次のコードを貼り付けます。
-
[保存] をクリックします。
- BrooklynやVentureではない無料のShopifyテーマを使用している場合は、以下のコード列を探します。
上記のコード列がproduct.liquid
で見つからない場合、[レイアウト] ディレクトリーのtheme.liquid
で見つかります。
-
BrooklynとVenture:BrooklynやVentureを使用している場合、別のコード列を見つけて編集する必要があります。[アセット] ディレクトリで、
theme.js.liquid
をクリックし、以下のコード列を探します。
- 下の新しい行に、次のコードを貼り付けます。
コードは次のように表示されます。
-
[保存] をクリックします。
管理画面から商品バリエーションにSKU番号を追加する
商品ページにSKUを表示するには、管理画面から商品バリエーションにSKU番号を追加する必要があります。
管理画面から [商品管理] に移動します。
編集する商品をクリックします。
複数のバリエーションがある商品については、[バリエーション] セクションで以下のようにSKU番号を追加します: バリエーションがない商品については、[在庫] セクションで、以下のようにSKU番号を追加します:
[保存] をクリックします。