【開発者向け】Shopifyで下書き状態の商品を開発中のテーマで確認する方法
はじめに
Shopifyで公開済みのストアに編集を加えることは多いですよね。
今回の事例としては、特定の商品だけに個別の情報を表示する(要は商品によって表示する内容を切り分ける)修正です。このときに困ったことと、その対処法について解説します。
困ったこと
公開済みストアのため、開発用に登録するテスト商品をアクティブにするとライブテーマ(本番環境)で表示されてしまうため、下書き状態で確認をしたいです。
しかし、下書き状態の商品を管理画面からプレビューするとライブテーマ(本番環境)が表示されるため、下書き状態では商品ページを確認できません。
対処法
下書き状態の商品プレビューをクリックします。

表示されたURLの中で「/products_preview?preview_key=xxxxx」部分をコピーします。

Shopify CLIで開発中に確認できるプレビュー「http://127.0.0.1:9292」の後ろに先ほどコピーした部分を貼り付けます。最終的には以下のような形式になります。
http://127.0.0.1:9292/products_preview?preview_key=xxxxx
少し手間ですが、これで下書き商品も開発内容が反映されているかをチェックしながら作業ができます。
参考記事
以下の記事を参考にさせていただきました。
いつも貴重な情報をありがとうございます。