EC-CUBEデザインカスタム
EC-CUBEのデザインテンプレートカスタマイズ
EC-CUBEでどのようなECサイト運営が出来るかがある程度わかってくると、殆ど場合、ご自身独自のECサイトデザインに変更したくなるものです。ここではEC-CUBEのデザインカスタマイズなどに必要な知識とEC-CUBEの導入について改めて目的の原点を振返ってみることについて説明しています。
カスタマイズに必要なスキル
方法1)デフォルトに使用されているヘッダ画像、メイン画像、各ボタン類全ての画像をオリジナルの画像に差換える。
方法2)方法1を含めサイトサイズや各ブロックサイズなどレイアウトデザインを含め大幅にオリジナルデザインにする。
大きく分けて2つのパターンになりますが、それぞれに最小限必要になる技術レベルを挙げますと、
方法1)
イラストレータなどのドロー系ソフトやPhotoShopなどの画像加工ソフトで自在に絵が書け、画像加工が出来、各素材をデータ容量を含め色々な形式に変換する事が出来るレベル。
作成した画像類をEC-CUBE管理画面の「コンテンツ管理」→「ファイル管理」から同ファイル名で上書きします。
全ての画像ファイルをオリジナルにするだけでもガラリと変わったオリジナルECサイトに変更が可能です。
方法2)
各ページや各ブロックのサイズやレイアウトはEC-CUBE内のスタイルシートとHTMLでデザインされています。
但しSmartyエンジンによるプログラムが自動で生成するHTMLページとなりますので、HTMLソース内にはSmartyの記述を含めておかなければ動作機能に支障をきたす事になってしまいます。
これらデザインの大幅な変更となると、必要な技術レベルとしては、通常のHTMLとCSSのコーディングを正確に理解している必要があります。
正確な理解とは、各ブラウザ表示の挙動に対応できるレベルです。
この時点で説明の大まかな意味が分からない方の場合は、方法2については残念ながらやや難易度の高い作業となってしまいます。
また、デザインの変更には必然的に機能的なカスタマイズが必要になる場合も有ります。
簡単な例を挙げると、例えば商品詳細画面の商品サブ画像の枚数はデフォルトで5枚までが管理画面より登録できるようになっていますが、仮に見た目のデザイン上でHTMLのソースを編集して画像を10枚表示できるように枠を作ったとしても表示どころか登録すらできません。
画像を登録する為にはDBに画像を保存する為のテーブルを追加作成するなどの作業が必要になり、DBを直接加工できるレベルも必要になってきます。
必要なレベルとしては、HTML、CSS、Smarty、DBの加工などになります。
EC-CUBEはオープンソースですので、無料で幾らでも試すことが可能です。
まずは、EC-CUBEを設置してみて、どのような動きなのか?自分でもカスタマイズ可能か?を検討してみるのも良い方法だと思います。
実際の検討をすることによって、自分で確実に行える部分とそうでない部分が明確になり、効率の良いコストダウンにつながるのではないかと思います。

