ネットショップ運営サービスの「カラーミーショップ」にて、ECサイトを制作中でしたが、ようやく納品完了となりました (^^*)
制作中に気づいた点・感じたことなどを書きます。
今回はその7回目(たぶん最終回)。
カラーミーのオプションである「ショップブログプラス」についてです。
~ 目次 ~
- ショップブログプラスとは?
- ショップブログプラスはレスポンシブ非対応
- ショップブログプラスの独自タグ
- ショップブログプラスのテンプレート
- スマホ版テンプレートのコード確認
ショップブログプラスとは?
カラーミーには「ショップブログプラス」というブログ機能があります。
有料オプションで月額300円(税別)。
以前は「ショップブログ」という無料のサービスが付属していたのですが、一年前に終了してしまったようです。
実はこの「ショップブログプラス」は、同じGMO系列「JUGEMブログ」の有料版と同じシステムです。
名称が違うだけで中身は変わりません。
つまりショップブログプラスのカスタマイズは、JUGEMブログのカスタマイズ手法をそのまま使えば良いです。
JUGEMブログのカスタマイズに関しては以下のブログが詳しいです。
ショップブログプラスはレスポンシブ非対応
ショップブログプラスは、基本的にレスポンシブデザインに対応していません。
PC・スマホ・ガラケーの3つの端末用に、それぞれ別個のテンプレートを作って、それを各端末のアクセスごとに切り替える方式をとっています。
なので、端末ごとのテンプレートをカスタマイズする必要があります。
(*ガラケー版はカスタマイズ不可です)
無理矢理にレスポンシブ対応させる方法もあるようですが、
*ブログ(JUGEM)のデザインをレスポンシブHTMLにしてみた。
Google先生に怒られそうなので私は使ってません (^_^;)
ショップブログプラスの独自タグ
ショップブログプラスを深くカスタマイズしようとすると、HTMLやCSS以外に独自タグを記述する必要があります。
実際にこれらのタグを使ってカスタマイズしてみましたが、カラーミー本体のタグに比べるとはるかに分かりやすいです。
これはカラーミー本体やWordPressなどのタグにある「ループ」や「条件分岐」という概念が無いためです。
そのため逆にカスタマイズの自由度も低くなっています。
ショップブログプラスのテンプレート
JUGEMブログは公式テンプレートが古いものばかりで、どれもこれも古くさくダサいです。
テンプレートのデザインをそのまま使うならば、格好良いユーザー作成のテンプレートを使った方が良いでしょう。
私の場合は、公式の「custom04ex」というテンプレートを使って、ほぼ原型をとどめぬレベルでごっそりカスタマイズしました。
「custom04ex」はJUGEMブログの最新の独自タグが盛り込まれています。
スマホ版テンプレートのコード確認
ショップブログプラスをカスタマイズする際に、非常に面倒だったことは、スマホ版テンプレートのHTMLのコードが見れないことです。
PC版の場合は、PCでブラウザを右クリックして「ソースを表示」で確認できますが、スマホだとそうはいきません。
これの解決はこちらのブログ記事を参考にされてください。
*スマホサイト(スマートフォンサイト)のソース(HTML)を見る方法