お気に入り登録：スタイル設定の構成方法

お気に入り登録アプリでは、オンラインストアでの優れた表示効果のために、お気に入り登録ボタンの外観をカスタマイズできます。この記事では、このアプリとその設定についてご案内します。

お気に入り登録の外観のカスタマイズ

＜strong＞お気に入り登録＜/strong＞ > ＜strong＞スタイル設定＜/strong＞ > ＜strong＞お気に入り登録＜/strong＞に移動します。

ナビゲーションバーの表示

ナビゲーションバーに表示されるお気に入り登録アイコンのスタイルをカスタマイズできます。以下の設定が利用可能です：

• アイコンスタイル：3種類のアイコンスタイルから選択できます。
• アイコン名の表示：チェックを入れると、お気に入り登録アイコンの隣に名前情報が表示されます。
• 名前の表示位置：名前をアイコンの右側または下側に表示するか選択できます。
• お気に入り登録内の商品合計数の表示：チェックを入れると、お気に入り登録内の商品合計数がアイコンの隣に表示されます。

商品リストの表示

商品リストに表示されるアイコンのスタイル、色、位置をカスタマイズできます。以下の設定が利用可能です：

• お気に入り登録ボタンを表示: 無効にすると、商品一覧ページにお気に入り登録アイコンが表示されません。
• アイコンのスタイル: 3種類のアイコンスタイルから選択できます。
• アイコンの色: 顧客がお気に入り登録に商品を追加する前後のアイコンの色を設定します。
• 表示位置: 商品一覧の商品の画像上にアイコンを重ねて表示する位置（左上、左下、右上、右下）をクリックして切り替えます。

商品ページの表示 

利用可能な設定は、一般的にOS 2.1以前のテーマと同じですが、OS 3.0テーマではボタンの表示位置に関してより柔軟なカスタマイズオプションが提供されています。詳細は以下をご覧ください：

• ボタンアイコンのスタイル：システムは3つのアイコンスタイルから選択できます。
• ボタンの色：顧客が商品をお気に入り登録する前後でボタンの色を別々に設定できます。
• ボタンテキストの表示：選択すると、下で設定したボタンテキストがアイコンの隣に表示されます。選択しない場合は、お気に入り登録のアイコンのみが表示されます。
• お気に入り登録したユーザー数の表示：選択すると、その商品をお気に入り登録したユーザー数が表示されます。

• 表示設定： 表示設定 > モードで、以下のオプションから選択できます：

  注：システムはテーマのバージョンを自動検出します。このオプションはOS 3.0テーマ使用時のみ利用可能です。OS 3.0テーマを使用していない場合は、PC版 / モバイルの表示位置のみ設定可能です。

• 自動：お気に入り登録はアプリのデフォルトルールに基づき商品詳細ページに表示され、追加設定は不要です。

  注：PC版またはモバイルの表示位置が商品画像の上に設定されている場合、ボタンテキストは表示できません。

  • PC版の表示位置：顧客がPC版でボタンを見る位置です。カートに追加ボタンの下か商品画像の上から選択できます。
  • モバイルの表示位置：顧客がモバイルでボタンを見る位置です。カートに追加ボタンの下か商品画像の上から選択できます。

• カスタム: 選択した場合は、テーマエディターに移動し、商品詳細ページにお気に入り登録ボタンを追加アプリパーツを手動で追加して、お気に入り登録の位置とレイアウトをカスタマイズする必要があります。

  注： カスタムを選択しても、テーマエディターで対応するアプリパーツを追加しない場合、お気に入り登録機能は正しく表示されません。

OS 3.0 テーマに推奨されるカスタム表示位置

アプリでカスタムを選択すると、OS 3.0 テーマエディターを使って商品詳細ページのさまざまなロケーションにお気に入り登録ボタンを柔軟に配置できます。以下は、一般的で推奨される3つの表示方法と設定手順です。

商品画像レイヤーの上に表示

1. テーマエディターで商品詳細ページに移動し、商品 > 商品メディアファイル > 商品ファイルオーバーレイに進み、お気に入り登録ボタンを追加アプリパーツを追加します。
2. 追加したお気に入り登録ボタンを追加アプリパーツをクリックして、ボタンスタイルやアイコンスタイルなど、商品画像上のボタンの表示方法を選択します。

購入ボタンの下に表示

1. テーマエディターで商品詳細ページに移動し、商品 > 商品情報に進みます。
2. 購入ボタンパーツの下にカーソルを合わせ、＋アイコンをクリックし、アプリを選択してから、お気に入り登録ボタンを追加アプリパーツを見つけて追加します。

商品タイトルまたは販売価格の横に表示

テーマエディターは現在、パーツの横並びレイアウトをサポートしていないため、コンテンツコンテナパーツを使用して、タイトルまたは販売価格をお気に入り登録ボタンの隣に配置する必要があります。以下の手順に従ってください：

1. テーマエディターで商品詳細ページに移動し、商品 > 商品情報 に進みます。パーツにカーソルを合わせ、＋アイコンをクリックし、テーマ > Content containers を選択します。
2. Content container の下で ＋パーツを追加 をクリックし、テーマ を選択して、必要に応じて Title または Price パーツを追加します。
3. Content container に再度カーソルを合わせ、＋アイコンをクリックし、Apps を選択して、Add wishlist button アプリパーツを見つけて追加します。これで Title + Wishlist button または Price + Wishlist button を含む統合コンテナが作成されます。
4. Content container をクリックし、設定パネルで レイアウト方向 を設定します。左右レイアウトを選択してパーツを横並びに表示します。必要に応じて配置、間隔、その他のスタイル設定も調整できます。

お気に入り登録の表示

顧客のお気に入り登録内に表示されるクイックビューのボタンとそのテキストをカスタマイズできます。以下の設定が利用可能です：

• クイックビュー：有効にすると、顧客はお気に入り登録から商品詳細を素早く確認し、直接購入することができます。この機能はすべての3.0テーマおよび選択された2.1テーマで利用可能です。
• クイックビューボタンのテキスト：顧客向けにクイックビューボタンに表示されるテキストです。

お気に入り登録の共有

＜strong＞お気に入り登録＜/strong＞ > ＜strong＞設定＜/strong＞ > ＜strong＞共有設定＜/strong＞に移動します。

顧客がお気に入り登録をFacebook、X、またはメールで共有できるように設定できます。

設定後、顧客はお気に入り登録を表示するときにこれらのチャネルを使って共有できます。


 

重要：ストアをデザインする際は、＜strong＞お気に入り登録（削除しないでください）＜/strong＞ページを削除しないでください（顧客はストアフロントで「お気に入り登録」を見ます）。そうしないと、顧客はお気に入り登録機能を正しく利用できなくなり、削除後はページを復元できません。