【解説】テーマ別!ショップデザイン切り替えガイド

更新日 : 2021/10/06
投稿日 : 2021/02/02

【2021年10月6日更新】
古いバージョンのショップデザイン機能は、2021年9月をもって提供を終了いたしました。
最新バージョンのショップデザイン機能のご利用方法は、こちらのページからご確認いただけます。

 

自由に組み合わせるだけでショップをデザインできる「デザインパーツ」などのカスタマイズが無料でご利用いただける、最新バージョンの「ショップデザイン機能」への切り替えは完了しましたか?
従来のショップデザイン機能は、2021年8〜9月に提供終了を予定しており、まもなくご利用いただけなくなります。
まだ、最新バージョンの「ショップデザイン機能」へ切り替えがお済みでない方は、こちらの記事を参考に、切り替えをお願いいたします。

切り替えが必要なショップデザイン機能

ショップ管理画面 > デザイン から、ショップデザイン機能を表示してください。
画面上部に黄色い切り替えの案内が表示されている場合、最新のショップデザイン機能ではありませんので、切り替えが必要です。「新しいデザイン機能を使う」ボタンをクリックして、切り替えに進んでください。

オフィシャルテーマ(無料のテーマ)をご利用中の場合

オフィシャルテーマ(無料のテーマ)をご利用中の場合、従来のショップデザイン機能では、カスタマイズできるデザインが背景などの数箇所のみに限定されていましたが、新しいショップデザイン機能に切り替えることによって、自由に組み合わせるだけでショップをデザインできる「デザインパーツ」など、たくさんのカスタマイズが利用できるようになるため、表現の幅が一気に広がります。

【デザインパーツを活用したデザイン例】

左:メイン画像で、ブランドイメージを印象つけるトップページ
右:お知らせパーツで、重要な情報を目に届きやすく

STEP1:「新しいデザイン機能を使う」をクリック

メニューから「デザイン」を開いてください。
最新のショップデザイン機能への切り替え案内が表示されますので、「新しいデザイン機能に切り替える」をクリックしてください。

STEP2:新しいショップデザイン機能が表示される

「新しいデザイン機能に切り替える」をクリックすると、最新のショップデザイン機能が表示されます。この段階では、まだ最新のショップデザイン機能への切り替えは完了していません。

従来のオフィシャルテーマは、スマートフォンデザインに対応していないため、新しいショップデザイン機能に切り替えると、ご利用中のテーマのデザインをベースにした新しいテーマが、自動で選ばれます。ロゴや背景は、利用中のものがそのまま引き継がれます。
新しいテーマは、すべてスマートフォン対応テーマのため、デザインをカスタマイズすると、スマートフォンサイト・PCサイトの両方に変更が反映されます。

STEP3:「保存する」で切り替えを完了する

「プレビュー」でデザインを確認したら、「保存する」をクリックしてください。
初回のみ「新しいショップデザイン機能に切り替えますか?」と確認メッセージが表示されます。「切り替える」を選ぶと、最新のショップデザイン機能への切り替えは完了し、新しいショップデザインもショップページに反映されます。

新しいショップデザイン機能では、スライドショーや商品のピックアップ表示など、アイディア次第で多様な表現が可能となります。カスタマイズできる内容は、こちらのページからご確認いただけます。

【ショップデザイン機能の使い方】について教えてください
【デザインパーツの使い方】について教えてください

デザイナーズテーマ(有料のテーマ)をご利用中の場合

デザイナーズテーマ(有料のテーマ)をご利用中の場合は、新しいショップデザイン機能に切り替えた後も、現在のテーマをそのままご利用いただくことができます。
ロゴや背景はもちろん、テーマの設定もそのまま引き継がれます。
また、スマートフォンにデザインのプレビューが追加されますので、スマートフォンでのデザインの確認もおこないやすくなります。

STEP1:「新しいデザイン機能を使う」をクリック

メニューから「デザイン」を開いてください。
最新のショップデザイン機能への切り替え案内が表示されますので、「新しいデザイン機能に切り替える」をクリックしてください。

STEP2:新しいショップデザイン機能が表示される

「新しいデザイン機能に切り替える」をクリックすると、最新のショップデザイン機能が表示されます。この段階では、まだ最新のショップデザイン機能への切り替えは完了していません。
デザインは、現在利用中の内容が引き継がれている状態となります。

STEP3:「保存する」で切り替えを完了する

「プレビュー」でデザインを確認したら、「保存する」をクリックしてください。
初回のみ「新しいショップデザイン機能に切り替えますか?」と確認メッセージが表示されます。「切り替える」を選ぶと、最新のショップデザイン機能への切り替えは完了し、編集をした場合、編集内容もショップページに反映されます。

デザインパーツをお試しいただく場合

デザインパーツを利用したい場合は、オフィシャルテーマをお選びいただく必要があります。
「テーマ」から、利用したいオフィシャルテーマを選択し、「このテーマを選ぶ」をクリックしてください。「テーマを変更してよろしいですか?」で「変更する」を選ぶと、テーマが変更されます(「保存する」を押すまでは、実際のショップページには反映されません)。

もともと利用していたデザイナーズテーマに戻したい場合は、「テーマ」から再度、元のテーマを選び直してください。このとき、「テーマ設定」は、最後に設定していた内容に戻ります。
※「ロゴ」「背景」は共通設定のため、変更した場合は、再度設定していただく必要がございます。

カスタムテーマ(『HTML編集 App』で編集したテーマ)をご利用中の場合

カスタムテーマ(『HTML編集 App』で編集したテーマ)をご利用中の場合は、新しいショップデザイン機能に切り替えた後も、現在のテーマをそのままご利用いただくことができます。
また、現在編集中のテーマは、新しい「HTML編集 App」を利用して、引き続き編集することができます。

STEP1:「新しいデザイン機能を使う」をクリック

メニューから「デザイン」を開いてください。
最新のショップデザイン機能への切り替え案内が表示されますので、「新しいデザイン機能に切り替える」をクリックしてください。

STEP2:新しいショップデザイン機能が表示される

最新のショップデザイン機能が表示されます。この段階では、まだ最新のショップデザイン機能への切り替えは完了していません。
デザインは、現在利用中の内容が引き継がれます。

STEP3:「保存する」で切り替えを完了する

「プレビュー」でデザインを確認したら、「保存する」をクリックしてください。
初回のみ「新しいショップデザイン機能に切り替えますか?」というメッセージが表示されます。
「切り替える」を選ぶと、最新のショップデザイン機能への切り替えは完了し、編集をした場合、編集内容もショップページに反映されます。あわせて、「HTML編集 App」も新しいバージョンに切り替えられます。

デザインパーツをお試しいただく場合

デザインパーツを利用したい場合は、オフィシャルテーマをお選びいただく必要があります。
「テーマ」から、利用したいオフィシャルテーマを選択し「このテーマを選ぶ」をクリックしてください。「テーマを変更してよろしいですか?」で「変更する」を選ぶと、テーマが変更されます(「保存する」を押すまでは、実際のショップページには反映されません)。

もともと利用していたカスタムテーマに戻したい場合は、「テーマ」から再度元のカスタムテーマを選び直してください。そのとき、「テーマ設定」は、最後に設定していた内容に戻ります。
※「ロゴ」「背景」は共通設定のため、変更した場合は、再度設定していただく必要がございます。

HTMLを編集する場合

切り替え前にカスタムテーマを利用していた場合、新しいショップデザイン機能に切り替えた時点での編集内容が、「HTML編集 App」に「デザイン機能切り替え前にHTML編集をしたテーマ」として登録されています。
「デザイン機能切り替え前にHTML編集をしたテーマ」を選択すると、従来のショップデザイン機能から引き継いだカスタムテーマを、続けて編集することができます。

「HTML編集 App」のくわしい操作方法は、こちらのページからご確認ください。

【HTML編集 Appの使い方】について教えてください

よくあるご質問

Q. 購入したテーマやHTML編集したテーマは、新しいショップデザイン機能でも引き続き利用できますか?

A. 新しいショップデザイン機能に切り替えてからも、現在ご利用中の有料テーマ、「HTML編集 App」でHTML編集したテーマは引き続きご利用いただけます。

Q. デザインパーツを使ってみたいのですが、現在利用している有料のテーマの設定が損なわれないか心配です。

A. 一度購入したテーマは「テーマ」から再度選ぶことが可能です。また、「テーマ設定」から指定できるテーマ独自の設定も、最後に設定していた内容に戻ります(「ロゴ」「背景」は共通設定のため、変更した場合は、再度設定をしていただく必要があります)。

Q. デザインパーツを使いながら、HTML編集をすることはできますか?

恐れいりますが、新しいショップデザイン機能のオフィシャルテーマ(デザインパーツが利用できる無料のテーマ)は、「HTML編集 App」には対応しておりません。ショップのデザインを変更したい場合は、デザインパーツなどカスタマイズ機能の利用をご検討ください。

Q. 新しいショップデザイン機能に切り替えたら、「スマートフォン用のデフォルトテーマ」設定が利用できなくなりました。

新しいショップデザイン機能のすべてのオフィシャルテーマ(無料のテーマ)は、あらかじめスマートフォンデザインに対応しているため、「スマートフォン用のデフォルトテーマ」設定は選択できなくなっています。デザインパーツなどのカスタマイズ機能を利用して、スマートフォンページも自由にデザインできるようになっています。

Q. 従来のショップデザイン機能に戻すことはできますか?

A. 恐れ入りますが、従来のショップデザイン機能に戻すことはできません。2021年8〜9月頃に、従来のショップデザイン機能のご提供は終了を予定しております。

今回は、最新のショップデザイン機能への、テーマ別の切り替え方法をご案内させていただきました。
すでに、多くのショップ様が最新のショップデザイン機能を利用して、素敵なショップデザインを実現されています。ぜひ、ブランドや商品の魅力が伝わるショップをデザインして、ショップのご成長にお役立てください。

 

新しいショップデザインに切り替える

\ ショップの開設実績 No.1 /
みんなが使ってるショップ作成サービス「BASE」

関連記事

運営ノウハウ

ショップ運営で知っておきたい情報を
フェーズにわけてまとめています

商品を売る

商品を魅力的に見せるための説明文の書き方から、仕入れに関する情報、配送ノウハウについてまとめています。

売上を伸ばす

売上を伸ばすために必要不可欠なマーケティング知識や、SNS運用のコツ、BASEアプリの活用方法などについてまとめています。

売上を管理する

決済に関する情報や、売上申請の方法などについてまとめています。