先日、カラーミーショップでネットショップを作成する案件で、デザインのカスタマイズを担当しました。
カラーミーショップのデザインカスタマイズは、既存のテーマのHTMLやCSSを直接編集ができるようになっているので、結構自由にカスタマイズすることができます。
さらに、わかりやすいUIデザインで簡単に編集できる「初級モード」も用意されているので、HTMLやCSSの知識がなくても安心です。
ちなみにHTML・CSSが編集できるページ一覧はこちら⬇️
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_09-1024x722.jpg)
上枠はHTMLもCSSも編集可能なページで、下枠はCSSのみ編集できるページとなっています。
デザインカスタマイズの自由度の高さはこれだけではありません!
同じくネットショップを作成できるBASEではできない「フリーページ」の作成も簡単にすることできます。
これが結構ありがたかったです。。
「フリーページ」を作成することで、期間限定の特設ページを作成したり、インスタの画像を埋め込んだギャラリーページを作成したり・・ネットショップをもっと充実させることができちゃいます!
「フリーページ」の作成も、HTML・CSSを記述する方法と下図のようにUIデザインで簡単に編集できる「初級モード」が用意されているので安心ですね。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_14.jpg)
今回は、実際にカラーミーショップの既存テーマをカスタマイズをするための手順と、画像ファイルの管理について紹介します。
既存テーマのカスタマイズ方法
![](https://toriton.link/wp-content/uploads/2020/11/toriton_color.jpeg)
既存のテーマのHTML記述を残しつつ、別途HTML・CSS編集する手順を紹介していきます。
この手順を踏んでおかないと、何かあったときに元の既存テーマのHTMLの状態に戻せなくなるので、やっておくことをおすすめします!
今回実際にHTML・CSS編集でデザインカスタマイズしてみて、使いやすかったテーマは、シンプルなデザインの無料テンプレート「nano」でした。
無料のテーマも結構あるので、自分のしたいデザインに近いテーマを選んでカスタマイズするのがいいかなと思います!
1.カラーミーショップにログイン後、左上メニューから「ショップ作成」→「デザイン」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_01.jpg)
2.デフォルトでは”ワンプレートホワイト”というテーマになっているので、下の「+他のテンプレートを追加」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_02-1024x629.jpg)
3.今回はシンプルでカスタマイズしやすい”nano”というテーマを追加します。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_03-1024x671.jpg)
4.追加済みのテンプレートに”nano”が追加されているので「✓利用する」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_04-1024x445.jpg)
5.利用中のテンプレートをそのまま編集するのではなく、「テンプレートをコピー」をクリックして複製します。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_05-1024x553.jpg)
6.任意のテンプレート名を入力して「この名前で追加」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_06-1024x613.jpg)
7.追加済みのテンプレートに複製した”nano”が追加されるので「✓利用する」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_07-1024x638.jpg)
8.複製したテーマであることを確認し「テンプレート編集」をクリックします。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_08-1024x548.jpg)
これで既存テーマのバックアップがある状態でカスタマイズすることができます!
画像ファイルの管理
![](https://toriton.link/wp-content/uploads/2020/11/toriton_discovery.jpeg)
ネットショップのデザインカスタマイズには必須の画像ファイルのアップロードですが、左メニューの「画像ファイル管理」をクリック。
![](https://toriton.link/wp-content/uploads/2021/01/colorme_contact_13-1-1024x618.jpg)
こちらの管理画面から以下のこと全て行うことができます。
実際に使ってみた感じ、カラーミーショップは画像ファイル管理がとてもわかりやすくて使いやすかったです!
同じくネットショップを作成できるBASEのファイルアップローダーは、アップロードしたファイルが画面上に残らず管理がめっちゃ大変だったので・・w
まとめ
![](https://toriton.link/wp-content/uploads/2020/11/matome_03.png)
実際にネットショップ作成サービスを何社か使ってデザインカスタマイズしてきましたが、圧倒的にカラーミーショップのデザインカスタマイズは自由度が高かったです。
個人的には「フリーページ」が作成できることと、画像ファイル管理がしやすい点を気に入りました!
カラーミーショップなら販売手数料が無料なので、ショップオーナーとして利用を考えている方にも魅力的ですね!
最近では、いくつかネットショップ作成サービスがあるのでどれを利用するか迷うと思います。
カラーミーショップにはお試し期間が30日があるので、迷っている方は試しに使ってみてくださいね^^