【ショップデザイン機能の使い方】について教えてください – ヘルプ | BASE

ショップデザイン機能は、メニューの「デザイン」から利用することができます。

ショップデザイン機能では、豊富なテーマから好きなデザインを選んだり、選んだテーマを自由にカスタマイズして、オリジナルのショップページを作成することができます。

基本の操作

基本的な操作は、画面上部の操作メニューからおこなうことができます。
テーマを選んだり、デザインのカスタマイズをしたい場合は、各編集メニューからおこないます。

【操作メニュー】

①編集メニュー	各メニューから、デザインの詳細なカスタマイズをおこなうことができます。
②ページ切り替え	編集するページを切り替えます。商品ページは表示順1番目の商品が表示されます。
③プレビュー	プレビュー画面を表示します。プレビュー画面では、編集可能なページ以外も自由にプレビューすることができます。
④保存する	編集内容を保存して、ショップページに反映します。
⑤終了する	編集内容を破棄して、ショップデザイン機能を終了します。

「テーマ」を選ぶ

「テーマ」メニューからは、デザインテーマを選択することができます。ショップページをデザインするには、まずはテーマを選んで、全体の構成を決めてください。テーマは、見た目の印象だけではなく、ショップの特徴にあったテーマを選ぶことも大切です。

※テーマを変更すると、それまでのカスタマイズ内容はリセットされますので、ご注意ください。

【デザインテーマの種類】

オフィシャルテーマ	「BASE」のオフィシャルテーマです。無料でご利用いただけます。
デザイナーズテーマ	デザインマーケットで購入したテーマです。 ※デザインパーツなど、一部のカスタマイズは利用できません。
カスタムテーマ	「HTML編集 App」を利用して作成したテーマです。 ※デザインパーツなど、一部のカスタマイズは利用できません。

「ロゴ」を設定する

「ロゴ」メニューからは、ショップロゴを設定することができます。
画像を指定するには、「ロゴ画像」を選んで、表示したい画像をアップロードしてください。

「表示する場所ごとにロゴをカスタマイズする」では、表示する場所にあわせて、ロゴの表示をカスタマイズができます。

「表示する場所ごとにロゴをカスタマイズする」で設定したロゴは、該当する場所のみに表示され、ほかの場所には表示されません。

くわしくは、こちらをご確認ください。

「ナビゲーション」を設定する

「ナビゲーション」メニューからは、ナビゲーションのテキストや並び順を変更したりすることができます。
「ナビゲーションを追加する」で、ショップの公式HPなど任意のリンク先を最大２つまでナビゲーションに追加することが可能です。
「CONTACT」メニューは、非表示にすることはできません。

「スタイル」を設定する

「スタイル」メニューからは、「フォント」や「カラー」を設定することができます。

【カラー種類】

ナビゲーションカラー	ナビゲーションのテキストカラーです。
テキストカラー	テキストに設定されるカラーです。
ボタンカラー	ボタンに設定されるカラーです。
アクセントカラー	予約商品ラベルや抽選商品ラベルなど、目立たせたい部分に設定されるカラーです。

「背景」を設定する

「背景」メニューからは、背景カラーや背景画像を設定することができます。
選択したテーマによっては、エリアごとに背景を設定することが可能です。

「パーツ」を追加する

「パーツ」メニューからは、ショップページに、「画像」や「テキスト」のようなデザインパーツを自由に追加することができます。
※このメニューは、無料のオフィシャルテーマを選択している場合のみご利用いただけます。

【PCの場合】

「パーツ」メニューを開きます。
好きなパーツを選び、ドラッグ＆ドロップでページに追加します。
パーツを選択状態にすると、パーツの詳細なカスタマイズをおこなうことができます。

【スマートフォンの場合】

「＋」をタップしてください。「ここにパーツを追加」が表示され、「パーツ」メニューが開きます。
追加したいパーツを選んでください。選んだパーツがページに追加されます。
追加されたパーツを選択すると、パーツの詳細なカスタマイズをおこなうことができます。

※詳細は、デザインパーツの使い方をご確認ください。

「テーマ設定」を編集する

「テーマ設定」メニューからは、各テーマ固有のオプションを設定することができます。
デザインマーケットで購入したテーマの詳細な設定方法につきましては、テーマの紹介ページをご確認ください。

※このメニューは、「デザインマーケットで購入した有料のテーマ」「『HTML編集 App』で編集をしたカスタムテーマ」を選択している場合のみ、ご利用いただけます。

【スマートフォン用のデフォルトテーマ設定】

「スマートフォン用のデフォルトテーマ設定」をONにすると、「BASE」がご提案するスマートフォン用のデフォルトテーマ（デザインはお選びいただけません）がスマートフォンで表示されます。
※「スマートフォン用のデフォルトテーマ」は、2022年2月28日にて、動作の保証を終了させていただくこととなりました。あらたに、「スマートフォン用のデフォルトテーマを使用する」をONにすることはできません。詳しくは、こちらをご確認ください。