ECCUBE3のデフォルトのテンプレートをコピーし独自のテンプレートでデザインカスタマイズしていく環境を整える方法をご紹介します。
目次
ECCUBE3のテンプレートの基礎知識
ECCUBE3の構成ファイルの中でデザインテンプレートに使用するためのファイルは以下の3か所です。
1:app/template/
2:src/Eccube/Resource/template/
3:app/plugin/プラグイン名/Resource/template/
独自デザインテンプレートの場合に関係するのは1と2になり、1はcss、js、imagesなど普段からよく使うビジュアル編集に利用するファイルが格納され、2には管理画面の【コンテンツ管理】の「ファイル管理、ページ管理、ブロック管理」で使うような構成ファイルが格納されています。
ECCUBE3をインストールした初期状態では上記/template/以下には【default】というテンプレート群が格納されているので複製して独自テンプレートを作っていきましょう。
ECCUBE3で独自テンプレート環境を作る
デフォルトテンプレートの内容をコピー
以下のデフォルトテンプレートの中身をすべてコピーします。
src/Eccube/Resouce/template/default
続いてコピーしたファイル群を以下のdefault内にペーストしましょう。
app/template/default
管理画面よりデフォルトテーマをダウンロード
管理画面の「オーナーズストア」→「テンプレート」→「テンプレート一覧」からデフォルトテンプレートをダウンロードします。
新しいテンプレート名をつけてアップロード
ダウンロードしたデフォルトのテンプレートをそのまま「オーナーズストア」→「テンプレート」→「アップロード」よりテンプレートコードとテンプレート名を入力してアップロードしましょう。
これでテンプレート一覧よりデフォルトテンプレートを複製して作った「mysite」という独自テンプレートが表示されているので選択して【登録】で完了です。
こうすることでデフォルトテンプレートを温存しつつカスタマイズを進めていくことができる環境となります。