ここから本文です
掲載日:2017年09月28日

トップページの構造

ストアトップページの構造を、お客様からみたページと、ストア運営ツールの項目を比較しながら紹介します。
どこに何を入力するとどのように表示されるのか、表示例を参考にしながら貴ストアページを作成ください。

※本マニュアルおよび動画の掲載内容は、予告なく変更される場合があります。
※システム仕様に変更があった場合は、「ストアクリエイターPro」トップページでお知らせいたします。
  「ストアクリエイターPro」トップページを頻繁にご覧になることをおすすめいたします。

お客様からみたストアトップページ例

ストア運営ツールの対応箇所

お客様からみたストアトップページ例

スマートフォン版 ストアトップページ例

ストアトップページに表示される情報は、ストア構築>ページ編集>[トップページプレビュー]で編集できます。
詳細は、「トップページを編集する」をご確認ください。

スマホ版

左図は、お客様から見たスマートフォン版ストアトップページです。

スマートフォン版ストアトップページは、上部のタブで3画面(商品を探す/最新情報/ストア情報)に切り替え表示ができます。
それぞれのタブに表示される内容と、出店者様が編集可能は領域は各項目の詳細をご確認ください。


  1. 「商品を探す」タブ
  2. 「最新情報」タブ
  3. 「ストア情報」タブ
お役立ちヘッダー表示
「スマートフォン版用ストア画像」を設定している場合、ヘッダーにストア画像が表示されます。
画像を設定していない場合、ストア名がテキスト表示されます。
「スマートフォン版用ストア画像」の設定方法は、「トップページを編集する」の「スマートフォン用情報」の項目をご確認ください。

1.「商品を探す」タブ サンプルイメージ

「商品を探す」タブ

左図は、お客様から見たスマートフォン版ストアトップページ「商品を探す」タブのサンプルです。
枠で囲まれた部分が編集可能な領域です。


青枠項目を入力、編集するには
青枠の項目は、ページ編集>「トップページプレビュー」のスマートフォン用情報>表示情報>フリースペースで編集できます。

オレンジ枠項目を入力、編集するには
オレンジ枠の項目はページ編集>「トップページプレビュー」のスマートフォン用情報>表示情報>おすすめ情報で編集できます。

2.「最新情報」タブ サンプルイメージ

「最新情報」タブ

左図は、お客様から見たスマートフォン版ストアトップページ「最新情報」タブのサンプルです。

「最新情報」は、自動でストアの最新情報を表示するページです。
自動表示される項目は、下記の3つです。該当する項目がない場合は、項目自体が表示されません。

  1. クーポンでお得にお買い物
  2. デイリーランキング
  3. リアルタイムランキング最新100注文
ポイント
フッター上部に表示される「Yahoo!ショッピングからのお知らせ」欄は、すべてのストアに表示されます。


1. クーポンでお得にお買い物
出店者様が、ストアクーポンを発行している場合は、クーポン情報が自動で表示されます。
表示されるクーポンは、ストアクリエイターPro>クーポン の設定で、「公開範囲(カート)」項目を「表示」に設定し、お客様が利用可能な状態になっているクーポンです。

表示可能なクーポンが複数ある場合、公開日の新しい順に表示されます。
初期表示では最大3本のクーポンを表示し、4本目以降のクーポンがある場合は[お得なクーポンを見る]ボタンが表示されます。
お客様が「お得なクーポンを見る」をタップすると、クーポン表示領域がひろがり、10件ずつ件数を増やして表示します。
お役立ちクーポンの設定
ストアクーポンの設定は、「ストアクーポンを新規発行する」をご確認ください。

2. デイリーランキング
直近7日間の注文を対象にランキングが表示されます。

3. リアルタイムランキング最新100注文
お客様がアクセスした時間から最新の注文を、注文件数の多い順に最大100件自動で表示されます。

初期表示で10位のまでのランキングが表示され、お客様が「リアルタイムランキングをもっとみる」をタップすると、表示領域がひろがり、10件ずつ件数を増やして表示します。

集計対象は、過去90日間です。キャンセルは加味されません。
過去90日間で、注文件数が100注文に満たない場合は、実際の注文数に応じた件数が表示されます。

3.「ストア情報」タブ サンプルイメージ

「ストア情報」タブ

左図は、お客様から見たスマートフォン版ストアトップページ「ストア情報」タブのサンプルです。
会社概要、お買い物ガイド(送料、お届け、お支払情報)を表示します。

緑の枠で囲まれた部分が編集可能な領域です。


緑枠項目を入力、編集するには
緑枠の項目は「ストア構築」のストア情報設定で編集できます。

ストア運営ツールの対応箇所

「ストアトップページ:スマートフォン用情報」入力画面

「スマートフォン用情報」入力画面
スマートフォン用情報
左図は、ストア運営ツール「ストアトップページ:スマートフォン用情報」入力画面です。

各項目の仕様、編集方法の詳細は下記をご確認ください。
参照ツールマニュアル
ページ編集>トップページの編集
>>「トップページを編集する」

「ストア構築:ストア情報設定」入力画面

「ストア情報設定」入力画面
ストア情報設定
左図は、ストア運営ツール「ストア構築:ストア情報設定」入力画面です。

各項目の仕様、編集方法の詳細は下記をご確認ください。
参照ツールマニュアル
ページ編集>トップページの編集
>>「トップページを編集する」

ページ編集

よくある質問 素材集
本文はここまでです このページの先頭へ