ここから本文です
掲載日:2020年09月15日

サイドナビパーツ:ストアサービス

【ご注意】
本ページで説明の機能は、2021年1月廃止予定です。
お早めに「新ストアデザイン」への切り替えを実施くださいますようお願いいたします。
「新ストアデザイン」に関するご案内 (実施概要、スケジュールのご確認)
「新ストアデザイン」対応のマニュアルよくある質問
「ストアデザイン」と「新ストアデザイン」の新旧パーツ比較一覧

「ストアサービス」パーツは、カートやお問い合わせページなど、重要なページへ移動するボタンをかんたんな設定で表示できるパーツです。
「ストアサービス」パーツは、通常モード、かんたんモードの両方で利用でき、共通領域のヘッダー、サイドナビに配置できます。「ストアサービス」パーツは、共通領域のヘッダーまたはサイドナビに配置できます(かんたんモード/通常モード共通)。
このページでは、ストアページ左カラムサイドナビ領域に配置する「ストアサービス」の編集方法について説明します。

「ストアサービス」編集画面を開く

「ストアサービス」を編集する

「ストアサービス」にボタン画像を設定する

お役立ち「ストアサービス」パーツを配置できる場所
「ストアサービス」パーツは、共通領域のヘッダー、サイドナビに配置できます。フッターには配置できません。

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

「ストアサービス」編集画面を開く

「サイドナビ共通設定」画面
ストアクリエイターPro「ストア構築」の[ストアデザイン]を選択します。

表示された画面左カラムの「ストアデザインメニュー」の共通設定から[サイドナビ]をクリックします。

「サイドナビ共通設定」「デザイン編集」タブの画面イメージに表示されている[ストアサービス]をクリックすると、画面下部に「ストアサービス」設定項目が表示されます。

お役立ち
「デザイン編集」タブの画面イメージに[ストアサービス]が見当たらない場合、「パーツの並び替え」タブを選択し、[ストアサービス]を画面イメージへドラックで移動してください。 画面イメージ[ストアサービス]が移動した後、再び「デザイン編集」タブへ戻り、「デザイン編集」タブの[ストアサービス]をクリックします。
参照ツールマニュアル
ストアデザイン>通常モード:サイドナビ
>>「サイドナビパーツの並べ替えとデザイン編集方法」

「ストアサービス」を編集する

手順1

「ストアサービス」編集フォーム
「ストアサービス」パーツ編集フォーム
「表示項目」から、ストアページに表示させたい項目を選択します。
すべてのボタンのリンク先は、自動で設定されます。

  • ストアトップ
  • カートを見る
  • 会社概要
  • プライバシーポリシー
  • ニュースレター申し込み
  • お買い物ガイド
  • お問い合わせ
  • オークションストア

ポイント
・リンク先、ボタン名称の変更はできません。
・ボタンの並び順変更はできません。

ストアサービスの表示例

ストアサービスの表示例 「表示項目」でチェックを入れた場合の表示例です。
パーツの色については手順2をご確認ください。


表示項目のリンク先

ストアアカウント(緑文字部分)は、出店者様のストアアカウントとなります。

表示項目 表示させた場合のリンク先 (自動設定)
ストアトップ https://store.shopping.yahoo.co.jp/ストアアカウント/
カートを見る https://order.shopping.yahoo.co.jp/cgi-bin/cart-form?catalog=ストアアカウント
会社概要 https://store.shopping.yahoo.co.jp/ストアアカウント/info.html
プライバシーポリシー https://store.shopping.yahoo.co.jp/ストアアカウント/privacypolicy.html
ニュースレター
申し込み
https://snlweb.shopping.yahoo.co.jp/shp_snl/optin/select/ストアアカウント
お買い物ガイド https://store.shopping.yahoo.co.jp/ストアアカウント/guide.html
お問い合わせ https://inform.shopping.yahoo.co.jp/ストアアカウント/contact.html
オークションストア 同一のストアカウントでヤフオク!ストアに出店している場合、ヤフオク!ストアへ
リンクします。
ヤフオク!ストアが開店していない場合は、ボタンが表示されません。
オークションストアを選択した場合、[ヤフオク!ストア]ボタンのみ、上の段に表示
されます。

手順2

「ストアサービス」編集フォーム
「ストアサービス」パーツ編集フォーム
表示させる「ストアサービス」の色・デザインを確認します。

パーツの色は、「テンプレート選択」やストアデザインの「全体の設定」で設定した色に従って表示されます。
「ストアサービス」パーツに画像を使用せず、また色の変更もおこなわない場合、画面下部の[保存]をクリックを押すと「ストアサービス」パーツの設定が完了します。

全体設定の色ではなく、このパーツのみ色変更をしたい場合は、手順3に進みます。

また、ボタン画像を配置する場合は「ストアサービス」にボタン画像を設定するに進みます。


参照ツールマニュアル
ストアデザイン>通常モード
>>「テンプレートの選択」
>>「全体の設定」

手順3

「詳しく設定する」画面
「詳しく設定する」画面
このパーツのみ色変更をしたい場合は、[詳しく設定する]をクリックします。

「色パネル」が開くので、ボタン色や文字色、枠色などの設定をおこないます。
[色を選ぶ]をクリックすると「色参照パネル」が開き、色見本を確認しながらの設定が可能になります。

設定したい色をクリックして[保存]ボタンを押すと、入力欄には選択した色を表すRGB値(カラーコード)が自動で表示されます。
お役立ち
入力欄に直接RGB値(カラーコード)を入れて指定することもできます。

各項目の色を選択を行なった後、[このモジュールの色を優先する]にチェックを入れると、テンプレートや全体設定で指定した色ではなく、ここで指定した色が優先表示されます。

色を指定したら、画面下部の[保存]をクリックを押すと「ストアサービス」パーツの設定が完了します。

「ストアサービス」にボタン画像を設定する

ストアサービスボタン画像の表示例

ストアサービスの表示例 「ボタン画像」で任意の画像を指定した場合の表示例です。

手順

「詳しく設定する」画面
「詳しく設定する」画面
リンクボタンを画像にしたい場合は、「ボタン画像」欄のそれぞれの[参照]ボタンを押し、画像を設定します。
利用したい画像は[参照]をクリックし、アップロードをおこなうか、あらかじめ「追加画像」としてアップロードした画像を選択指定します。

ポイント画像サイズ
ボタン画像はそのままのサイズで表示されます。
ページの幅にご注意ください。

画像を指定したら、画面下部の[保存]をクリックを押すと「ストアサービス」パーツの設定が完了します。
よくある質問サイドナビの設定
Q.サイドナビをなくすことはできますか。 もしくは、サイドナビの幅を変更できますか。
A.サイドナビの幅は、選択しているテンプレートの種類(タイプ)により異なります。

テンプレート選択機能でサイドナビのないテンプレート(タイプ1)を選択すると、サイドナビのないストア作成できます。
また、サイドナビのあるテンプレートを選択の場合、サイドナビ幅は180ピクセル、200ピクセル、220ピクセル のいずれかになります。

サイドナビ幅180ピクセル
テンプレートがタイプ2、タイプ5、タイプ7、タイプ10の場合
サイドナビ幅200ピクセル
テンプレートがタイプ3、タイプ6、タイプ8、タイプ11の場合
サイドナビ幅220ピクセル
テンプレートがタイプ4、タイプ9の場合

テンプレートの変更方法や、テンプレートによるサイドナビ幅は、本マニュアル「テンプレートの選択」をご確認ください。
よくある質問サイドナビのレイアウト崩れ
Q.サイドナビのデザインレイアウトが崩れてしまいました。直すにはどうしたらよいですか。
A.デザインレイアウト崩れを直すためには、なぜデザインレイアウト崩れたのか、原因を確認し、修正をおこなう必要があります。
本マニュアル「サイドナビレイアウト崩れの修正」にて、おもな原因と対処についてまとめていますので、ご確認ください。

ストアデザイン

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