カラーミーショップにSEO+テンプレートを追加する手順

デザインテンプレートを追加する

カラーミーショップでショップを表示するには、まずテンプレートを選択し、テンプレートを編集する形でショップページを作ります。

 

テンプレートには無料47種類・有料31種類(2020年5月18日時点)用意されており、料金プランに応じて10種類〜インストールすることができます。

カラーミーSEO+テンプレートの場合は、無料テンプレートのカラーミーキットをインストールした上で、購入いただいたテンプレートデータをコピー&ペーストで上書きしていく流れとなります。(→図解

 

テンプレートを複製して保存することもできるので、デザインを変更したいときなどは複製テンプレートを編集。プレビューで確認して問題がなければ本番環境に移行させる、ということが可能です。

カラーミーSEO+のインストール方法

カラーミーSEO+をダウンロード

カラーミーSEO+テンプレート」からご注文ください。
お支払いが完了すると、ダウンロードURLが書かれたメールが届きますのでURLアクセスしダウンロード。

SEO+テンプレートのダウンロード画面

zipファイルですので解凍してください。フォルダの中身は以下のようになっています。

 

SEO+フォルダの中身

実際に使用するのはhtmlフォルダの6ファイルのみです。(style.cssファイルは使用しませんが、カスタマイズ時の参考用に入れてあります。)

カラーミーキットをインストール

Sはデータ量削減の為にカラーミーキットのcssファイルとJavaScriptを一部利用しているので、予めカラーミーキットをインストールしていただく必要があります。

管理画面 > デザイン > テンプレート追加

にすすみ、【無料】テンプレートを表示。

一番下までスクロールすると「カラーミーキット(2カラム)」が登場しますので、インストール。

カラーミーキットのインストール画面

 

テンプレート一覧画面

矢印の部分をクリックすると、テンプレートの編集画面にすすみます。

「利用する」をクリックすると、実際のショップページにテンプレートが適用されるのでご注意ください。

テンプレートを編集する

テンプレート名は変更できるので、間違えないように変更しておくことをおすすめします。

 

HTML・CSS編集をクリックして編集画面を開きます。

カラーミーのテンプレート編集画面です
順番に1から14まで番号が振られていますが、カラーミーSEO+テンプレートでは1から6番までのファイルを置き換えるので、HTML・CSSともにコードをすべて削除しておきます。

 

次に、ダウンロードしたSEO+のhtmlファイルをテキストエディタで開いていただくと、htmlコードが表示されるので、すべて選択してコピー。

 

テンプレートの編集画面にもどり、(1)共通 には 1-common.html のように対応した番号のファイルをすべて貼り付けます。(CSSファイルは使いませんので、HTMLのみの貼付けで結構です。)