モバイルショップで表示させるバナー、ポップアップ、アイコンを設定します。
モバイルショップのバナー・ポップアップ設定
モバイルショップ上部のバナーおよびポップアップタイプ、フルスクリーン型のポップアップウィンドウが表示できます。
本機能は「スマートデザイン」を使用する必要があります。
バナー設定
- [Mobileデザイン>デザイン機能設定>バナー・ポップアップ設定]へ移動します。
- 「登録」をクリックし、登録するバナータイトルを入力します。
- 表示期間を選択し、「ステータス」設定で「使用中」を選択します。
- 「詳細画像」の「ファイルを選択」をクリックし、画像ファイルを登録します。
- 「リンクURL」に、バナーをクリックするとアクセスするモバイルショップのURLを入力します。
- クーポン通知バナーを使用する場合は「クーポン通知設定」にチェックを入れます。
- 「画像設定」では「画像スワイプ」、「縦並べ表示」から表示方法を選択します。
- 「画像表示設定」で「バナーで表示」を選択します。
- 「プレビュー」をクリックして確認した後、「保存」をクリックします。
Note
- バナー画像のサイズは320px×100pxをおすすめします。
- 「ステータス」設定で「保留」または「終了」にチェックするとバナーは表示されません。
- 「クーポン通知設定」のチェックボックスにチェックを入れると、登録したバナーがショップのメインページにてクーポンを保有している顧客を対象に表示されます。
- クーポン通知設定の機能を使用するには、[プロモーション>クーポン管理>クーポン登録]で「ログイン時のクーポン発行の通知」を「使用する」に設定してください。
- 「画像設定」で表示方法を選択する項目は、登録したバナー画像が2件以上ある場合にのみ適用される機能です。
- 「画像設定」で「画像スワイプ」を選択した場合、モバイルショップ上部のバナー表示エリアにはバナーが1件のみ表示されます。
バナー画像が2件以上登録されている場合、左右にスワイプして確認できます。
- 「画像設定」で「縦並べ表示」を選択した場合、モバイルショップ上部のバナー表示エリアには登録されたバナー画像が順番に表示されます。
ポップアップウィンドウ(ポップアップタイプ)の設定
- [Mobileデザイン>デザイン機能設定>バナー・ポップアップ設定]へ移動します。
- 「登録」をクリックし、登録するポップアップタイトルを入力します。
- 表示期間を選択し、「ステータス」設定で「使用中」を選択します。
- 「詳細画像」の「ファイルを選択」をクリックし、画像ファイルを登録します。
- 「リンクURL」に、ポップアップをクリックするとアクセスするモバイルショップのURLを入力します。
- クーポン通知バナーを使用する場合は「クーポン通知設定」にチェックを入れます。
- 「画像設定」では「画像スワイプ」、「縦並べ表示」から表示方法を選択します。
- 「画像表示設定」で「ポップアップウィンドウで表示」を選択後、「ポップアップタイプ」を選択します。
- 「ウィンドウを閉じる方法」で、ポップアップウィンドウの下部に表示させる方法を選択します。
- 「ポップアップの表示位置」をピクセル単位で入力します。
- 「プレビュー」をクリックして確認した後、「保存」をクリックします。
Note
- ポップアップ画像の横幅は、320px以上をおすすめします。
- 「ステータス」設定で「保留」または「終了」にチェックするとポップアップは表示されません。
- 「画像設定」で表示方法を選択する項目は、登録したポップアップ画像が2件以上ある場合にのみ適用される機能です。
- 「画像設定」で「画像スワイプ」を選択した場合、ポップアップ表示エリアにはポップアップが1件のみ表示されます。
ポップアップ画像が2件以上登録されている場合、左右にスワイプして確認できます。
- 「画像設定」で「縦並べ表示」を選択した場合、登録されたバナー画像が順番にすべて表示されます。
ポップアップウィンドウ(フルスクリーン型)の設定
- [Mobileデザイン>デザイン機能設定>バナー・ポップアップ設定]へ移動します。
- 「登録」をクリックし、登録するポップアップタイトルを入力します。
- 表示期間を選択し、「ステータス」設定で「使用中」を選択します。
- 「詳細画像」の「ファイルを選択」をクリックし、画像ファイルを登録します。
- 「リンクURL」に、ポップアップをクリックするとアクセスするモバイルショップのURLを入力します。
- クーポン通知バナーを使用する場合は「クーポン通知設定」にチェックを入れます。
- 「画像設定」では「画像スワイプ」、「縦並べ表示」から表示方法を選択します。
- 「画像表示設定」で「ポップアップウィンドウで表示」を選択後、「フルスクリーン型」を選択します。
- 「ウィンドウを閉じる方法」で、ポップアップウィンドウの下部に表示させる方法を選択します。
- 「プレビュー」をクリックして確認した後、「保存」をクリックします。
Note
- ポップアップウィンドウのフルスクリーン型は、登録した画像比率のままモバイルショップページの中央に表示されます。
- ポップアップ画像の横幅は、320px以上をおすすめします。
- 「ステータス」設定で「保留」または「終了」にチェックするとポップアップは表示されません。
- 「画像設定」で表示方法を選択する項目は、登録したポップアップ画像が2件以上ある場合にのみ適用される機能です。
- 「画像設定」で「画像スワイプ」を選択した場合、ポップアップ表示エリアにはポップアップが1件のみ表示されます。
ポップアップ画像が2件以上登録されている場合、左右にスワイプして確認できます。
- 「画像設定」で「縦並べ表示」を選択した場合、登録されたバナー画像が順番にすべて表示されます。
スマートデザインのHTML設定
- [Mobileデザイン>デザイン管理>Myデザイン]へ移動します。
- 適用するデザインテンプレートの「編集」をクリックし、ガイドに従ってHTML、CSSの編集を行ってください。
- 設定後、モバイルショップで正常に表示されているかを確認します。
Info
- PCからモバイルショップのバナー・ポップアップを確認する方法(Chromeブラウザ)
- ショップ画面にて「F12」キーで開発者ツールを起動させ、画面左上のモバイル&タブレットアイコンをクリックします。
- ショップ画面上部でモバイル端末(Galaxy、iPhone等)を選択することができます。変更後、再読み込みを行います。
モバイルショップのアイコン設定
- [Mobileデザイン>デザイン機能設定>アイコン設定]へ移動します。
- アイコン名の横にある編集アイコンをクリックします。登録済みのアイコン画像を変更することができます。
- 「ファイルを選択」をクリックし、変更するアイコン画像を登録した後、「保存」をクリックします。
Note
- アイコン登録ウィンドウにある「リセット」をクリックすると、アイコンが初期化されます。
- 在庫切れ商品、おすすめ商品、新着商品のアイコンの場合、[ショップ管理>運営管理>詳細設定>商品設定]へ移動し、「商品アイコンの設定」で「使用する」を選択するとショップに表示されます。
- 決済方法のアイコンの場合、[ショップ管理>決済管理>決済方法の設定]へ移動し、「決済方法の表示タイプ」で「ロゴアイコン」を選択するとショップに表示されます。
- PC版のショップの場合、[PCデザイン>デザイン機能設定>アイコン設定]へ移動すると設定が可能です。