ショップデザイン機能は、メニューの「デザイン」から利用することができます。
ショップデザイン機能では、豊富なテーマから好きなデザインを選んだり、選んだテーマを自由にカスタマイズして、オリジナルのショップページを作成することができます。
基本の操作
基本的な操作は、画面上部の操作メニューからおこなうことができます。
テーマを選んだり、デザインのカスタマイズをしたい場合は、各編集メニューからおこないます。
【操作メニュー】
①編集メニュー | 各メニューから、デザインの詳細なカスタマイズをおこなうことができます。 |
---|---|
②ページ切り替え | 編集するページを切り替えます。 商品ページは表示順1番目の商品が表示されます。 |
③プレビュー | プレビュー画面を表示します。プレビュー画面では、編集可能なページ以外も自由にプレビューすることができます。 |
④保存する | 編集内容を保存して、ショップページに反映します。 |
⑤終了する | 編集内容を破棄して、ショップデザイン機能を終了します。 |
「テーマ」を選ぶ
「テーマ」メニューからは、デザインテーマを選択することができます。 ショップページをデザインするには、まずはテーマを選んで、全体の構成を決めてください。テーマは、見た目の印象だけではなく、ショップの特徴にあったテーマを選ぶことも大切です。
※テーマを変更すると、それまでのカスタマイズ内容はリセットされますので、ご注意ください。
【デザインテーマの種類】
オフィシャルテーマ | 「BASE」のオフィシャルテーマです。 無料でご利用いただけます。 |
---|---|
デザイナーズテーマ | デザインマーケットで購入したテーマです。 ※デザインパーツなど、一部のカスタマイズは利用できません。 |
カスタムテーマ | 「HTML編集 App」を利用して作成したテーマです。 ※デザインパーツなど、一部のカスタマイズは利用できません。 |
「ロゴ」を設定する
「ロゴ」メニューからは、ショップロゴを設定することができます。
画像を指定するには、「ロゴ画像」を選んで、表示したい画像をアップロードしてください。
「表示する場所ごとにロゴをカスタマイズする」では、表示する場所にあわせて、ロゴの表示をカスタマイズができます。
「表示する場所ごとにロゴをカスタマイズする」で設定したロゴは、該当する場所のみに表示され、ほかの場所には表示されません。
くわしくは、こちらをご確認ください。
「ナビゲーション」を設定する
「ナビゲーション」メニューからは、ナビゲーションのテキストや並び順を変更したりすることができます。
「ナビゲーションを追加する」で、ショップの公式HPなど任意のリンク先を最大2つまでナビゲーションに追加することが可能です。
「CONTACT」メニューは、非表示にすることはできません。
「スタイル」を設定する
「スタイル」メニューからは、「フォント」や「カラー」を設定することができます。
【カラー種類】
ナビゲーションカラー | ナビゲーションのテキストカラーです。 |
---|---|
テキストカラー | テキストに設定されるカラーです。 |
ボタンカラー | ボタンに設定されるカラーです。 |
アクセントカラー | 予約商品ラベルや抽選商品ラベルなど、目立たせたい部分に設定されるカラーです。 |
「背景」を設定する
「背景」メニューからは、背景カラーや背景画像を設定することができます。
選択したテーマによっては、エリアごとに背景を設定することが可能です。
「パーツ」を追加する
「パーツ」メニューからは、ショップページに、「画像」や「テキスト」のようなデザインパーツを自由に追加することができます。
※このメニューは、無料のオフィシャルテーマを選択している場合のみご利用いただけます。
【PCの場合】
- 「パーツ」メニューを開きます。
- 好きなパーツを選び、ドラッグ&ドロップでページに追加します。
- パーツを選択状態にすると、パーツの詳細なカスタマイズをおこなうことができます。
【スマートフォンの場合】
- 「+」をタップしてください。「ここにパーツを追加」が表示され、「パーツ」メニューが開きます。
- 追加したいパーツを選んでください。選んだパーツがページに追加されます。
- 追加されたパーツを選択すると、パーツの詳細なカスタマイズをおこなうことができます。
※詳細は、デザインパーツの使い方 をご確認ください。
「テーマ設定」を編集する
「テーマ設定」メニューからは、各テーマ固有のオプションを設定することができます。
デザインマーケットで購入したテーマの詳細な設定方法につきましては、テーマの紹介ページをご確認ください。
※このメニューは、「デザインマーケットで購入した有料のテーマ」「『HTML編集 App』で編集をしたカスタムテーマ」を選択している場合のみ、ご利用いただけます。
【スマートフォン用のデフォルトテーマ設定】
「スマートフォン用のデフォルトテーマ設定」をONにすると、「BASE」がご提案するスマートフォン用のデフォルトテーマ(デザインはお選びいただけません)がスマートフォンで表示されます。
※「スマートフォン用のデフォルトテーマ」は、2022年2月28日にて、動作の保証を終了させていただくこととなりました。あらたに、「スマートフォン用のデフォルトテーマを使用する」をONにすることはできません。詳しくは、こちらをご確認ください。