WISHLIST MANAGER

お気に入りボタンと一覧ページを設置する

所要 約5分 最終更新

WISHLIST MANAGERの導入手順です。アプリ埋め込みの有効化、商品ページへのボタン設置、お気に入り一覧ページの作成までをテーマエディタの3ステップで行います。

セットアップはテーマエディタで完結する3ステップです。テーマファイルへの書き込みは一切ないので、アンインストールしても残骸は残りません。

はじめる前に

  • ストアの管理者権限が必要です
  • 公開中のテーマを編集します。事前にテーマを複製しておくと安全です

手順

1. アプリ埋め込みを有効にする

アプリのホームにある「テーマエディタを開く」を押すと、アプリ埋め込みの画面が開きます。「WISHLIST MANAGER」のトグルをオンにして保存します。

この埋め込みがお気に入り機能の本体です。オフのままだとボタンは表示されても押して反応しない状態になるので、必ず最初に有効にしてください。

2. 商品ページにお気に入りボタンを追加する

テーマエディタで商品テンプレートを開き、商品情報のセクションにブロック「お気に入りボタン」を追加します。カートに入れるボタンの近くが定番の位置です。

ブロックの設定で見た目を調整できます。

  • スタイル — アイコンのみ / アイコン+テキスト / ボタン型(枠線つき)
  • アイコンサイズ、ハートの枠線色・塗りつぶし色
  • ラベル文言(追加時 / 保存済み)

3. お気に入り一覧ページを作る

Shopify管理画面で空のページ(例: /pages/wishlist)を作成し、テーマエディタでそのページを開いて、セクションにブロック「お気に入り一覧」を追加します。見出しと列数(PC)を設定できます。

ヘッダーメニューなどからこのページへのリンクを張っておくと、再訪の導線になります。

コレクションの商品カードにもハートを出す(任意)

アプリ埋め込み「WISHLIST MANAGER」の設定にある「商品カードにハートを表示」をオンにすると、コレクションや特集セクションの商品カード画像の右上にハートが付きます。ブロックの追加は不要です。Dawn系・Horizon系のテーマで動作し、認識できないテーマでは何も表示しません。

動作を確認する

  1. ログアウトした状態(ゲスト)で商品ページのハートを押し、塗りつぶし表示に変わることを確認します。リロードしても保存されたままです
  2. お気に入り一覧ページを開き、商品が並ぶこと、×ボタンで削除できることを確認します
  3. そのままログインして、もう一度お気に入り一覧ページを開きます。ゲストのときに保存した商品が引き継がれていれば、ログイン時の自動引き継ぎも動いています

引き継ぎの確認は、商品ページではなくお気に入り一覧ページで行うのが確実です。

うまくいかないとき

ボタンは見えるのに押しても反応しない

アプリ埋め込み「WISHLIST MANAGER」がオフになっています。手順1を確認してください。

商品ページにボタンが出ない

「お気に入りボタン」ブロックは商品の情報があるセクションの中に置く必要があります。商品テンプレート以外のページでは何も表示されません。

商品カードのハートが出ない

カード表示はテーマの構造を自動判定しており、Dawn系・Horizon系以外のテーマでは表示されないことがあります。その場合も商品ページのボタンは通常どおり使えます。

追加読み込みされた商品カードにハートが付かない

「もっと見る」や無限スクロールで後から読み込まれたカードには、ページを再読み込みするまでハートが付かないことがあります。

無料プランのお気に入り追加はストア全体で月500件までです。上限に達しても、お客様の閲覧・削除・保存済みのお気に入りには影響しません。利用状況はアプリのホームで確認できます。

このページは役に立ちましたか?

Shopify App Store のレビューは、同じ課題を持つ他のストア運営者がアプリを見つける手がかりになります。良かった点も、足りない点も、そのまま書いてください。

レビューはShopify App Store上に公開されます。書き換え・削除はご自身で行えます。