「アイテム比較」の設定方法について

「アイテム比較」の設定方法について

アイテム比較でお勧めの商品・サービスをプッシュする

 

アイテム比較は複数の製品・サービスの価格や特徴などを比較し、
「どの商品がお勧めか」を分かりやすく表示することができる機能です。
本機能を使うことで、どの商品を購入するかを迷っているユーザーに、「この商品がお勧め」だという事を明確に伝えることができるため、成約率を高める効果が期待できます。

 

4~5個の商品情報(タイトルや画像など)を登録し、お勧めの商品にチェックを入れるだけの操作となっています。
デザインやカラーのバリエーションも豊富に揃っているため、購入を迷っているユーザーの後押しをしたい場合に是非ご活用ください。

 

アイテム比較のデザイン一覧はこちら

アイテム比較の設定方法について

パーツメニュー内の「アイテム比較」→「アイテム比較の追加」を選択する

ページ内に「アイテム比較」のパーツを設置したい場合、文字装飾メニュー3段目にある「パーツ」メニューを開き、
アイテム比較→「アイテム比較の追加」を選択してください。

 

アイテム比較の設定画面が表示される

下図のようなアイテム比較の設定画面が表示されます。こちらの画面から各種設定を行います。

アイテム比較では、最大5個まで追加することができます。

 

アイテムを作成する

まずは、アイテム比較に表示させるアイテム(商品・サービスの情報)を追加します。
アイテムを追加するには上部ツールバーにある「新規追加」ボタンをクリックしてください。
すると下図のような設定画面が表示されます。こちらから、商品・サービスの情報を設定していきます。

 

比較アイテムの設定

タイトル(必須)

比較するアイテムのタイトルを入力します。
通常は、商品名やサービスを入力するのが適切です。

商品画像

アイテム比較上で表示されるアイテムのサムネイル画像の設定を行います。
右側にある「画像」アイコンを選択すると画像管理画面が表示されますので、こちらから画像を選択してください。
なお画像サイズについては、スタイルシート側で自動調整されます。

リンク先URL

商品の詳細ページなどへのリンク先のURLを指定します。
右側にある各種アイコンを選択すると、内部ページまたは既存サイトのURLを指定することができます。
なお、リンク先URLは指定しなくても問題はありません。

価格

商品の価格を指定します。
価格を表示させたくない場合は空欄の状態にしてください。

ピックアップ

商品をオススメとして表示するかを指定します。
この項目をチェックすると、商品が強調表示されるようになります。
(なおこの項目は後からでも設定が可能です)

テキスト

キャッチコピー

画像の下部に表示される「商品のキャッチコピー」を指定します。
必須事項ではないため空欄のままでも構いません。

商品の説明文

商品の簡潔な説明文を入力します。
文章が長すぎるとデザインが若干乱れるため、100~150文字前後で指定するのが良いでしょう。

上記の設定が完了したら、画面下部にある「OK」ボタンをクリックしてください。

 

商品情報が追加される

商品の設定が完了すると、下図のように一覧画面に商品情報が追加されます。
再編集をしたい場合は上部ツールバーにある「編集」ボタンをクリックして、再度設定を行って下さい。

 

 

 

同様の操作で、アイテム比較に表示する商品を追加していく。

同様の操作で2個目以降の商品情報を追加していきます。
比較を行うためにも、少なくとも3個以上の商品を設定するのが適切です。

 

 

既存のアイテムを複製して編集したい場合は、「複製」ボタンを選択することで可能です
また、商品情報の順番を入れ替えたい場合は「左に移動」、「右に移動」をクリックしてください

 

ピックアップにチェックを入れる

ピックアップの設定を行っていない場合、お勧めの商品にチェックを入れることが可能です。
(オススメとして強調できるのは、1商品のみとなります)

 

 

なおピックアップの設定は必須事項ではないため、単純に商品の一覧を表示させたい場合は、ピックアップをオフの状態にしてください。

 

必要に応じてレイアウトの調整を行う

アイテム比較全体のデザインやカラーなどを変更したい場合は
画面下部の「アイテム表示設定」、「ボタンの設定」タブから変更可能です

 

 

 

アイテムの表示設定

タイプ

アイテム比較全体のデザインを変更することができます。
デザインを確認したい場合は、こちらのページをご確認ください。

カラー アイテム比較全体のカラーを変更することが可能です。デフォルトの場合は「ブルー」が選択されていますが、全12色の中からお好みのカラーを選択することができます。
角丸 アイテム比較を角丸で表示させたい場合は、こちらの項目をオンの状態にしてください。
テキスト設定

ピックアップした商品の上部に表示されるテキストを指定することができます。
デフォルトでは「オススメ」と指定されていますが、例えば「イチオシ」などのテキストに変更したい場合はこちらで指定します。

価格の単位

商品価格の単位を指定します。
例えば税込み表示で表示したい場合は「円(税込み)」と指定します。

ボタンの設定

ボタンカラー アイテム比較内のボタンのカラーを変更します。デフォルトでは「ブルー」が選択されていますが、
全12色の中からお好きなカラーを選択することができます。
ボタンテキスト

ボタンリンク内のテキストを指定することができます。
デフォルトでは「お申し込み」と設定されていますが、適宜変更してください。

 

プレビューでレイアウトを確認する

各種設定が完了したら、「プレビュー」タブを選択することでアイテム比較のレイアウトを確認することができます。
再編集を行いたい場合は、「アイテム設定」タブを開き編集を行って下さい。

 

 

OKボタンを選択し、管理IDを入力する

アイテム比較の設定が完了したら、画面下部の「OK」ボタンをクリックします。
すると下図のような管理IDの入力画面が表示されます。(新規作成時のみ)
デフォルトでは「アイテム比較1」と入力されていますが、ご自身で管理しやすい名前に変更してください。

 

 

記事内にアイテム比較タグが挿入される

以上でアイテム比較の設定は完了です。記事内にアイテム比較の独自タグが挿入されます。
設定を再変更したい場合は、挿入された独自タグをダブルクリックすることで設定画面を再表示することができます。

 

【新サービス】サイト制作代行サービスをリリースしました!