ここから本文です
掲載日:2020年11月04日

「新ストアデザイン」への移行

このページでは「新ストアデザイン」を初めて設定する方、初めて移行作業をする方、
移行作業にお悩みのある方向けの情報をまとめています。

はじめての「新ストアデザイン」移行作業

移行作業の困った!を解決

参照ツールマニュアル
「新ストアデザイン」の移行状況を確認したい場合は下記のページをご参照ください。
>>「「新ストアデザイン」移行前のチェック」


はじめての「新ストアデザイン」移行作業

「(旧)ストアデザイン」からの移行作業をはじめて実施される方
開店準備中などで「新ストアデザイン」を初めて設定される方向けに情報をまとめました。
詳細は各リンク先ページにてご確認ください。


概要を知りたい

動画 動画「パソコン版ページデザインの変更 概要説明」
動画を再生する(4分17秒)
「新ストアデザイン移行」って何?
作業をするとどうなるの?
作業をしないとどうなるの?
作業期日は決まっているの?
…など、「新ストアデザインの概要」について、動画で解説しています。
作業の前に動画のご視聴をオススメします!
過去のお知らせ リリース前に出店者様にメールなどでご案内したページです。
スケジュール、概要、簡単なステップなどをまとめています。
マニュアル 「ストアページの構成」では、お客様に表示されるページイメージを元に、どの部分に何が表示されるのかを解説しています。「(旧)ストアデザイン」から移行作業を行う方はもちろん、開店準備を進めている方もご確認いただくことで、貴ストアの設定イメージが掴みやすくなります。

「新旧パース比較」ページはその名の通り、「(旧)ストアデザイン」で設定していたパーツがどうなるのか、新ストアデザインのどの項目に設定しなおせばよいのかを一覧でまとめています。「(旧)ストアデザイン」からの移行作業を行う方にお役立ていただけるページです。
よくある質問 出店者様からヘルプデスクにお寄せいただいた質問を一問一答形式でご案内しています。
よくある質問は、随時更新しています。左記以外のよくある質問はこちらをご確認ください。

各項目を設定したい

動画(1) 新ストアデザインの設定(1)
動画を再生する(8分48秒)
「新ストアデザインの設定(1)」の動画では以下をご案内しています。
設定にあたり、動画で手順をご確認いただけます。
  • ナビゲーション
  • 看板(7:38以降)
動画(2) 新ストアデザインの設定(2)
動画を再生する(8分48秒)
「新ストアデザインの設定(2)」の動画では以下をご案内しています。
設定にあたり、動画で手順をご確認いただけます。
  • お知らせ
  • フッター:ストア情報(2:35以降)
  • フッター:おすすめ商品(3:54以降)
  • フッター:フリースペース(5:13以降)
  • フッター:インフォメーション(6:11以降)
  • フッター:コピーライト(7:07以降)
  • 商品ページへの適用(7:40以降)
動画(3) 新ストアデザインの設定(3)
動画を再生する(7分08秒)
「新ストアデザインの設定(3)」の動画では以下をご案内しています。
設定にあたり、動画で手順をご確認いただけます。
  • サイドナビの構成
  • サイドナビ カテゴリの設定方法(3:02以降)
  • 商品ページ以外への適用(5:36以降)
マニュアル 各項目の設定方法を説明したマニュアルページです。
よくある質問 出店者様からヘルプデスクにお寄せいただいた質問を一問一答形式でご案内しています。
よくある質問は、随時更新しています。左記以外のよくある質問はこちらをご確認ください。

設定内容を商品ページに反映したい

動画 新ストアデザインの設定(2)
動画を再生する(8分48秒)
各項目を設定した後、「商品ページへの適用」作業が必要です。
7分40秒以降で「商品ページへの適用」方法について、動画で手順をご確認いただけます。
マニュアル 設定した内容を「お客様がご覧になるパソコン版商品ページ」に適用するために必要な作業を、説明したマニュアルページです。
よくある質問 出店者様からヘルプデスクにお寄せいただいた質問を一問一答形式でご案内しています。
よくある質問は、随時更新しています。左記以外のよくある質問はこちらをご確認ください。

設定内容を商品ページ以外に反映したい

動画 新ストアデザインの設定(3)
動画を再生する(7分08秒)
各項目を設定した後、「商品ページ以外への適用」作業が必要です。
5分36秒以降で「商品ページ以外への適用」方法について、動画で手順をご確認いただけます。

商品ページ以外への適用を行うことで、「新ストアデザイン」項目が適用されるページは下記です。
  • ストアトップページ
  • カテゴリページ
  • カスタムページ
  • ストア検索ページ
  • 会社概要ページ
  • プライバシーポリシー
  • お買い物ガイド
  • 一時休店ページ
  • 退店ページ
マニュアル 設定した内容を「お客様がご覧になるパソコン版ページ」に適用するために必要な作業を、説明したマニュアルページです。
よくある質問 出店者様からヘルプデスクにお寄せいただいた質問を一問一答形式でご案内しています。
よくある質問は、随時更新しています。左記以外のよくある質問はこちらをご確認ください。


移行作業の困った!を解決

「新ストアデザイン」の移行作業を進めている出店者様からお寄せいただいた質問を元に、
移行時の疑問にお答えする情報をまとめました。

[1]よくある質問[1]旧項目に対応した項目
Q.「(旧)ストアデザイン」で設定している情報を「新ストアデザイン」でも表示させたい。
旧設定項目と新設定項目の整理はどうしたらいいのか。
A. ツールマニュアルに、新旧パーツの比較ができる表をご用意しました。
「(旧)ストアデザイン」項目に対応している項目は下記マニュアルをご確認ください。


よくある質問[2]フリースペースの移行
Q.「フリースペース」にHTMLを記述しています。
そのままソースをコピーしてもいいですか。
A. 「新ストアデザイン」の変更に伴うHTMLタグの変更はありません
「(旧)ストアデザイン」で記述していたソースをそのままコピーして利用いただけます。

ただし、「新ストアデザイン」は、body幅などのレイアウトが異なるため、表示崩れが起こる可能性があります。
どのような表示崩れが起こりえるのかは、出店者様がどのように「(旧)ストアデザイン」を設定しているかにより異なるため、一様のご案内ができません。
「(旧)ストアデザイン」で記述したソースを「新ストアデザイン」でご利用になる場合は、必ず「プレビュー」をご確認ください。
万一、表示崩れなどが発生した場合は、横幅のサイズを調整いただくなどの修正をお願いいたします。

よくある質問[3]「新ストアデザイン」でのスクロールバー
Q.フリースペースのHTMLソースをそのままコピーしたら、横幅が収まりきらず、スクロールバーが出てしまいます。
スクロールバーを表示させないようにするにはどうしたらいいですか。
A. 「新ストアデザイン」では、お客様が表示している環境(※)に応じて、フリースペースの幅が646ピクセル~964ピクセルでサイズが変動します。
閲覧時のブラウザサイズ等に応じて、横スクロールバーが自動で表示されます。
(※)モニターの解像度、ブラウザの設定などに応じスクロールが表示される幅が決定されるため、表示できるサイズに幅が生じます。

▼フリースペース変動イメージ
変動イメージ拡大画像

横幅を広く表示できない環境下で見切れることを最大限防ぎたい場合は、646ピクセル以下でコンテンツを作成ください

よくある質問[4]作業時間の確保が困難
Q.商品ページが多く、表示崩れの確認・修正作業に時間がかかりそうです。
作業時間が確保できず、期日までの対応が困難です。
A. Yahoo!ショッピングが認定するサードパーティ各社から、「新ストアデザイン」適用を代行、サポートする制作代行サービスや制作ツールが提供されております。
「新ストアデザイン」への移行作業時間の確保が困難な場合、有料サービスのご利用もご検討ください。


よくある質問[5]「B-Space」利用
Q.オプションサービス「B-space」を利用してにぎわい演出をしています。
表示が崩れそうで「新ストアデザイン」への移行にためらいがあります。
A. オプションサービス「B-Space」で提供のにぎわいサービス「動く!商品棚」「にぎわいタイムライン」「にぎわいバナー」等をごフリースペースなどに利用の場合、「新ストアデザイン」のサイズに合わせた設定が必要になります。
「新ストアデザイン」で「B-Space」のにぎわいサービスをどのように利用すればよいか、下記のページでご紹介していますので「B-Space」をご利用の出店者様はご参照のうえ、設定変更をお願いいたします。

本文はここまでです このページの先頭へ