アプリなしでShopifyで取り扱っている商品の販売開始日時を指定したいが、方法がよくわからない・・・
この記事では、こういったお悩みを解決する方法を紹介します。
※販売開始日時の指定にメタフィールドを使う方法がよく紹介されていますが、現状のShopifyの仕様ではブラウザのキャッシュの問題でうまく動作しないので、この記事では別の実装方法を紹介します。
手順
今回の実装における重要な考え方は、下記の2つです。
- 特定のタグを持っている商品は、商品詳細ページで購入ボタンが非活性になる
- 上記の特定のタグをShopifyFlowで狙った日時につけ外しできるように設定する
ShopifyFlowはアプリの管理画面からノーコードで操作できますが、タグ付与によるボタンの非活性操作は、Liquidの知識が必要になります。
ただ、この記事では、Shopifyテーマ「dawn」をもとに解説しているので、「dawn」を使われている方は、この記事の内容を実施するだけで大丈夫です。
※dawnのテーマのバージョンによっては、そのまま使えない場合もあります
【追記】
人気テーマ「Prestige」に対応したコードはこちらにあります。
テーマを開発する
まずは、「商品が特定のタグを持っている場合に商品詳細ページで購入ボタンを非活性化する」ための実装を行います。
Shopify管理画面「オンラインストア」→「テーマ」→実装したいテーマの「コードを編集」を選び、コード編集画面に遷移してください。具体的な流れは下記動画を参照ください。
次に、コード編集画面から「main-product.liquid」というファイルを検索して、そのファイルの中身を下記コードとそっくりそのまま入れ替えてください。こちらも、上記動画を参照しながら実践してください。
See the Pen Untitled by 福水正太 (@shotafukumizu) on CodePen.
これで、テーマの開発は完了です。
商品にタグを付与する
販売開始日時を指定したい商品の管理画面に移動して、その商品に「販売開始日時指定」と「販売開始日時指定テキスト_販売開始は〇〇を予定しています」いうタグを設定してください。
こちらは、管理画面の操作だけなので、比較的簡単だと思います。
（2つ目の 販売開始日時指定テキスト_~~~~~ の方は、商品詳細ページに表示される文字を制御するものなので、あなたの環境や状況に応じてアンダーバー( _ )以降を書き換えてください ）
※このタグを付与した時点で、この商品の商品詳細ページは購入ボタンが非活性化されるので、まずはテスト用の商品などでお試しください
ShopifyFlowの設定を行う
最後に、付与したタグを、指定した日時に自動的に削除するためのワークフローをShopifyFlowで設定していきましょう。こちらもノーコードでできますが、商品にタグを付与するより、少し操作が難しいです。
アプリのインストールがまだの方はこちらからインストールしてください
下記に手順と動画をまとめているので、ご参照ください。
1. ワークフローを起動するためのトリガーを設定する
ShopifyFlowの管理画面から新しいワークフローを作成し、そのワークフロー起動のトリガーに、販売開始したい日時を指定します。
（今回は、この記事を書いている2023年11月6日14時00分 をトリガーとします）
2. 特定のタグ(今回は 販売開始日時指定 )を持った商品を取得する
どの商品からタグを削除するかを判別するため、特定のタグを持った商品をShopify内のすべての商品から探して取得します。
（この記事では、先ほど付与したタグ名 [販売開始日時指定] を取得しています）
3. 2で取得した商品から特定のタグ( 今回は 販売開始日時指定 )を削除する
2で取得した商品から指定のタグを削除する処理を設定します。
（ここでも、先ほど付与したタグ名 [販売開始日時指定] を指定します）
これで、指定した日時に指定した商品から指定したタグを削除するワークフローの設定ができました！
まとめ
Shopifyでアプリを使わずに販売開始日時を指定する方法を紹介しました。各ストアの状況や方針に合わせて、いろいろと読み替えながらご参照ください。
この記事が、あなたのEC運営のお役に立てれば幸いです。
※この記事は2024年07月時点の内容です。今後のアップデートやShopifyの仕様変更等により、記事の内容が古くなってしまう可能性があります。
この記事の監修者
＼ShopifyでEC構築を検討中の方へ／
現在、Shopify公式は無料のお試しキャンペーンを実施しています。
百聞は一見に如かずといいますが、ネット上で情報収集するよりも、実際にShopifyに触れるほうが何倍も効率が良いでしょう。
下記の案内ページからキャンペーンの詳細をご確認ください。
)
)
)
)
)
)
)
)
