ネットショップ開設サービス「Cafe24」でEdibotデザインでショップデザインを編集してみた

Cafe24のデザインの特徴

Cafe24では、無料で利用できるデザインテンプレートがあらかじめ複数用意されています。

2021年7月時点で利用できる無料のデザインテンプレートとしては、以下のデザインテンプレートが用意されています。

簡単に説明すると、「Furniture Store」というデザインは、サンプル商品が「家具」になっていますが、白をベースカラーにシンプルな配置のレイアウトになっています。

その為、家具だけでなくどんな商品にもシンプルに合わせやすいデザインテンプレートだと思います。

「Baby」というデザインは子供服などを販売するネットショップに合わせたデザインになっています。

配色デザインにパステルカラーを多く採用しているため、ベビー用品や子供向けのグッズ、おもちゃなどの商品との相性が良いデザインになっていると思います。

「Jewelry」というデザインは、アクセサリーなど高級商材などの販売に適したショップデザインとなっています。

洗練されたレイアウトデザインで、無駄な配色を行わずに、商品をより際立たせているデザインテンプレートだと思います。

また、トップページの真ん中には、売れ筋ランキングをカテゴリー別で表示させるようにレイアウトしているので、初めて来店したユーザーがランキングから商品を選びやすい流れを演出しています。

高額商品をネット通販で購入するのに抵抗があるという消費者も少なくありませんが、商品の魅力がネットショップのデザインやブランドイメージから伝われば、ある程度高額な商品であってもネット通販で購入してもらう事は十分に可能だと思います。

「Food」というデザインは、主に食料品を販売するネットショップに最適化されたデザインになっています。

Cafe24のデザインテンプレートの特徴としては、無料でもクオリティの高いデザインテンプレートが用意されているという事です。

食品、食材など人が口に入れる商品を取り扱う場合、清潔感はもちろんのこと、その商材をより魅力のある商品、食べてみたい商品と思ってもらうような、購買意欲をかきたてる必要があります。

Foodというデザインテンプレートは、白をベースカラーにしたデザインになっているため、どんな商品にも相性が良いと思います。

「Fashion」というデザインは、洋服やシューズ、バッグなどのアパレル、ファッションアイテムを販売するのに最適化されたデザインになっています。

Cafe24では、他にも、「Fashionable」や「Casual」などのデザインもファッション系のショップデザインに最適なデザインテンプレートを無料で用意してくれています。

女性向けのアパレルにはFashionable、男女の区別なくカジュアル系の商品を扱う場合にはCasualなどネットショップで販売する商品のジャンルに合わせて、ベースとなるデザインテンプレートを選択してみて下さい。

Cafe24では、無料のデザインテンプレートだけでなく、よりこだわりのあるデザインを希望されるユーザーには有料のデザインテンプレートも用意されています。

どのデザインもプロが作成したショップデザインとなっているため、クオリティの高さとレイアウト設計などには満足のいくデザインが多数用意されていると思います。

Cafe24のデザインについてもっと詳しく知りたいという方は、以下のページにCafe24のデザインについての詳細な情報をまとめていますのでこちらもご一読いただければと思います。

では、実際にCafe24を利用してネットショップのパソコン用デザインを設定する際の流れをご説明したいと思います。

Cafe24のデザイン管理方法

今回は、Cafe24の管理画面の「プロモード」でデザイン管理を行う方法についてご説明いたします。

既にCafe24でのアカウント開設が完了している方は、管理画面にログインする以下のURLからログインしてください。

まだ、Cafe24でのネットショップ開設がお済でないという方は、以下の公式ページからアカウント開設を進めてみて下さい。

Cafe24の管理画面にログインが完了したら、切り替えモードを「プロモード」に変更します。

プロモードに切り替わると、画面上部のメニューに「PCデザイン」というメニューがありますのでPCデザインをクリックしてください。

PCデザインのページに切り替わると、左側のメニューもデザイン管理のメニューが表示されるようになります。

デザイン管理の各メニューについてもご説明しておきます。

Cafe24のPCデザインの設定方法

今回は、Cafe24の管理画面の「プロモード」で「PCデザイン」を設定する場合の流れをご説明したいと思います。

メインメニューの「PCデザイン」をクリックします。

左側のメニュー上部にある「デザイン編集」をクリックします。

「デザイン編集」をクリックすると以下のような画面が表示されるかと思います。

これは、Cafe24のデザイン編集で利用する「Edibotデザイン」というシステムのチュートリアルです。

Edibotデザインでは複雑なHTMLなどの設定作業を行う事なく、直観で操作できるドラッグアンドドロップやコンポーネント検索によって、必要な画像やメニューを設定する事ができる仕組みとなっています。

Edibotデザインの詳細な説明については、各自Cafe24の管理画面上で表示される上記画面にてご確認下さい。

では、実際にEdibotデザインでPC用デザインを設定する方法、手順についてご説明していきます。

まずはこの画面を閉じる為に右下にある「これ以上表示しない」の右の「×」をクリックして画面を閉じておきます。

Edibotデザインの画面上部には小さ目のアイコンで「スマホ」と「PC」の画面を切り替えるメニューが用意されています。

今回はパソコン用のデザインの設定なので、「PC」のアイコンをクリックします。

パソコン用のショップデザインの「メインイメージ」を設定するには、「メインバナー」に用意している画像の中から、自分が設定したい画像を選択し、ドラッグアンドドロップでデザイン上のメインイメージの箇所に移動させます。

Edibotデザインでショップデザインを編集する際には、多くの場合ドラッグアンドドロップという簡単な作業で変更を実施する事ができます。

メインイメージが決まったら、その下にあるサブバナーの設定を行います。

サブバナーに関しても、メインイメージと同様に、用意しておいた画像をドラッグアンドドロップで入れ替え、追加を行うことができます。

デフォルトのデザインテンプレートでは、サブバナーの直下に「おすすめアイテム」の一覧が表示されるように設定されています。

こちらはご自身の好みの商品ジャンルを選択して表示させることができます。

メイン表示させることができるアイテムとしては「おすすめアイテム」以外に「新着アイテム」や自分で追加したカテゴリの商品などを露出させることができます。

新商品などが入荷した際には、できるだけトップページ上で露出アピールしておくと、リピーターやショップのファンのユーザーの目に触れやすくなると思います。

また、Cafe24のショップデザインには、動画コンテンツの掲載もデフォルトで可能となっています。

もっとも手軽に動画コンテンツをアップロード、掲載する方法としてはYouTubeがありますが、YouTube上にアップロードしたコンテンツを「URL」を入力するだけで呼び出し表示させることができます。

ご自身で作成したプロモーション動画や、商品説明動画などがあれば商品ページごとに表示させる事で転換率アップに繋がると思います。

また、メーカー系商品を販売している場合、メーカーの許可が下りるのであれば、その商品用のプロモーション動画がYouTube上にアップされている場合、URLを張り付ければ商品の広告、プロモーション的な動画として自分のショップにて表示させることができます。

現在では、YouTuberによる宣伝効果やプロモーション効果などはウェブ上の広告としても非常に高い効果が期待されていますし、動画の有無で購入を決めるユーザーも商品ジャンルによっては一定数存在しています。

YouTubeに限らず動画によるプロモーションは今後ますます盛んになると思いますので、対応が可能であれば商品に対する動画コンテンツも作成してみてはいかがでしょうか。

以上がCafe24のパソコン用のショップデザインの設定方法の手順となります。

実際に作業してみてわかったのは、Edibotデザインを利用して編集すれば、ほとんど直観的に画像を選択してドラッグアンドドロップで移動したり削除したりするだけでレイアウトの設定を自分の好みにできるという事でした。

ネットショップのデザイン設定と言えば、HTMLやCSSといった専門的な知識がなければ編集や変更ができないイメージを持たれている方もおられますが、Cafe24ではそういった専門知識のない方でもネットショップのデザインを自在に変更できるという事がわかりました。

Cafe24のPCデザイン設定のまとめ

今回は、ネットショップを無料で開設できるサービスとして、海外販売にも無料で対応できる事で注目されているCafe24（カフェ24）のショップデザインについてEdibotデザインを使ってパソコン用のショップデザインの設定方法と手順、デザイン管理の内容などを紹介いたしました。

今回パソコン用のショップデザインの設定方法としてご紹介しましたが、スマホ用のページ設定もEdibotデザインで実施する為、ほぼ同手順で行うことができる事がわかりました。

どちらかと言えば、メインイメージやバナー画像などを作成し、あらかじめ用意しておく事の方に時間やスキルなどが必要となる事もわかりました。

Cafe24ではシンプルでありながら、商品の魅力を伝えやすいデザインテンプレートが無料でも多数用意されていますから、特にデザイン力などが無いという方でも問題なくショップのデザイン設定を行う事ができると思います。

また、どのデザインテンプレートを選択したとしても、Edibotデザインを利用してデザイン編集を行う事で、自分の好みのレイアウトデザインに変更する事もできます。

有料のデザインテンプレートを購入してよりこだわりのあるデザインからスタートしてもいいと思いますが、慣れるまでは無料のデザインテンプレートの中から自分の販売する商品に最適なジャンルのデザインを選んでみて、レイアウトなどを独自でカスタムしてみる事からスタートするとよいと思います。

ちなみに、無料でネットショップを開設する方法としてテレビコマーシャルでも頻繁に放送されているBASE (ベイス)とSTORESについて、Cafe24と比較した記事もありますので、こちらも参考にしていただければと思います。

他にも、Cafe24と同じく越境ECの対応ができるShopifyとの比較や、2021年5月からフリープランがリリースされたカラーミーショップとの比較記事もまとめております。

これからネットショップを新規開設される方は、是非ご一読いただければと思います。

今回の記事の内容が、Cafe24でネットショップを開設している方の参考になれば幸いです。