ネットショップの全要素を自由に編集できるスマートデザイン編集ウィンドウ

Cafe24では、プロのデザイナーが制作したハイクオリティなデザインテーマをご提供します。
ネットショップのコンセプトに合わせて、希望のテーマを選んでください。
提供されている基本デザインテーマは、パソコン向けショップだけでなく、スマホ向けショップにも提供されます。

無料デザインを見る
さらに多くのデザインを見る

基本として提供されているショップデザインまたはデザインモジュールの全体的な色合いを修正するなど、希望のスタイルに修正することができます。

テーマが違っても、ショップのデザインには共通した要素があります。

デザイン構造は、大きく4種類に分けることができます。

では、ショップの基本を構成するヘッダー、ボディ、フッター、ナビゲーションを設定してみましょう。

ヘッダー領域には、基本としてマイショッピング、カートアイコン、ロゴなどが設定されています。
ロゴ領域を除いた残りのアイコンは、変更しなくても問題なく使用できます。

ロゴは基本設定として、管理画面側が入力した「ショップ名」が自動表記されます。
ロゴを変更したい場合は、管理画面の「PCデザイン」から「デザイン編集」ボタンをクリックすれば修正することがで

フッター領域には、管理画面側で入力したショップ情報が表示されます。
表示される情報を変更したい場合は、管理画面の「ショップ管理 > 基本情報設定 > マイショップ情報」で修正することができます。

販売する商品が決まったら、商品分類情報を入力します。
分類情報は、管理画面の「商品管理 > 商品カテゴリ管理 > カテゴリ設定」で設定できます。

管理画面に分類情報が入力されると、ショップナビゲーション領域に自動的に表示されます。

メイン画面は ショップの中心です。ショップを宣伝し、売上を伸ばすために、さまざまな領域をご活用ください。

メイン画面上段には、通常はバナーを表示します。バナーは、ショップのイメージを伝えたり、プロモーションや宣伝を行ったりするなど、顧客の関心を惹きつけるためのお知らせ領域として活用します。バナーを表示する時は、ショップのコンセプトに合わせてデザインしたバナーを使用する必要があります。

メインには、販売を目的として、新商品、ベスト商品など、多彩なコンセプトの商品を表示させることができます。

メイン商品を陳列するには、まず商品を登録して、管理画面の「商品管理 > 商品管理 > メインページ商品の入替え」で陳列を設定します。

デザイン編集ツールとして「スマートデザイン」および「Edibotデザイン」をサービスしており、デザインは編集ツールごとに管理できます。

ショップのデザインは編集ツールの区別なしに最大12件まで作成可能であり、その中から1件をメインデザインとして指定します。
メインデザインは、ショップ画面に適用されるデザインです。

メインデザイン以外のデザインは別途で保存して管理できます。
プロモーション実施期間またはシーズンごとにデザインを変更することで、ショップに活気を与えることができます。

管理画面の「PCデザイン > Myデザイン」で「新規デザイン追加」ボタンをクリックすると、「スマートデザイン」または「Edibotデザイン」のデザインを追加することができます。

詳しいご利用方法は、マニュアルをご確認ください。

マニュアルへ移動

作成したデザインは、管理画面の上部にあるデバイスアイコン(PC/Mobile)をクリックしてご確認ください。
マルチショップのプレビューを確認したい場合は、国旗アイコンをクリックしてください。

または「Myデザイン」でデザイン名の下にあるURLをクリックすると確認できます。

[Mobileデザイン > 環境設定]の「Mobile用デザイン使用設定」で設定します。

(※レスポンシブデザインは編集ツールを「Edibotデザイン」に設定した場合にのみ適用されます。)

(※「Mobile用デザイン使用設定」を「使用する」に設定する場合、PCショップにのみレスポンシブデザインが適用され、
Mobileショップはスマートデザインで編集する形になります。)

Cafe24が提供するショップのデザインをユーザーが自在に編集できるよう、
編集の参考になる「デザインガイド」が用意されています。

ユーザーにHTMLの基礎知識やオープンソースを提供し、
コーディングなどウェブサイトの制作に関する専門的な知識がなくても編集ウィンドウを手軽に使えるようにサポートします。

デザインガイドを見ながらHTMLソースを変更し、簡単にデザインを編集してみましょう。

デザインガイド