EC-CUBE4のテンプレート構造はWordpressと違って固定となり、。WordPressはindex.php１つでテーマとして成立してましたが、EC-CUBEの場合はデフォルトテンプレートの構造をそのまま使用する必要がある。

テンプレートフォルダ
  - Block/ ブロック
  - Cart/ カートページ
  - Contact/ お問い合わせページ
  - Entry/ 会員登録ページ
  - Forgot/ パスワードの再発行ページ
  - Form/ フォームパーツ
  - Help/ ご利用ガイドなど
  - Mail/ 自動送信メールのテンプレート
  - Mypage/ マイページ
  - Product/ 商品一覧と詳細
  - Shopping/ 決済ページ
  - block.twig ブロックのフレーム
  - default_frame.twig 全ページのフレーム
  - error.twig エラーページ
  - index.twig トップページ
  - pager.twig ページネーション用テンプレート
  - snippet.twig スニペットテンプレート？

EC-CUBE4では単に現在使用中のテンプレートからファイルを取得するだけでなく、そこになければソースコードにあるファイル、さらにプラグインのファイルと順に読み込まれる。

// まずは現在使用中のテンプレートに含まれるファイルが呼び出される
1. ECCUBEROOT/app/template/[template_code]

// 現在使用中のテンプレートにファイルがなければ、ソースコードにあるファイルが呼び出される
2. ECCUBEROOT/src/Eccube/Resource/template/[template_code]

// ソースコードにないもの（例えばプラグインで追加されたもの）はプラグインにあるファイルが呼び出される
3. ECCUBEROOT/app/Plugin

ファイルを編集する場合は、app/templateの方にあるテンプレートフォルダにテンプレート構造と同じ場所にファイルを設置する。

もしくは管理画面の「コンテンツ管理 -> ページ管理」で編集すると自動的にファイルが作成されるのでそのファイルを編集する。

これはWordpressの子テーマに近いイメージ。カートや決済、マイページなど重要な部分はデフォルトでそれ以外のページのみ変更する、といったことも可能。

ソースコードのファイルは変更しない

ソースコードの方が読み込まれているからといってソースコードのファイルを編集しない。ソースコードのファイルを編集してしまうとデフォルトに戻せなくなるので注意。

EC-CUBE4のテンプレートカスタマイズ方法は大きく分けて次の２つ。

• 1.テンプレートファイルをコードエディターで直接編集する
• 2.管理画面からページやブロックを編集する

簡単なカスタマイズであれば管理画面から編集することができ、複雑な修正が必要な場合はコードエディターを使うのが推奨。

1.テンプレートファイルをコードエディターで直接編集する

テンプレートファイルはコードエディターで開いて編集することが可能。編集したファイルはFTPツールなどを使ってapp/templates/テンプレート名にアップロード。

アップロードした後に変更を反映するために、キャッシュクリアが必要なので忘れない。

注意！サーバーにページやブロックのファイルを配置するだけでは表示されない

管理画面からではなく、サーバーに直接ページテンプレートやブロックのtwigファイルをアップロードしてもEC-CUBEには認識されず、ブラウザに表示することもできない。

新しくページやブロックを作成する場合は必ず管理画面から作成。そのあとならコードエディターを使って編集することができる。

2.管理画面からページやブロックを編集する

EC-CUBE4の管理画面メニューの「コンテンツ管理 -> ページ管理」や「コンテンツ管理 -> ブロック管理」からページとブロックの編集ができる。

※管理画面から編集した場合はキャッシュが自動的にクリアされる。

新しくページやブロックを追加する

最初から用意されているデフォルトページやブロックだけでなく、新しくページやブロックを作って追加することも可能。

管理ページの上部にある「新規作成」ボタンを押すと新しいページやブロックの作成が可能。

新しくページを作成する場合は次の3つの情報が必要。

• ページ名: ページの名前、分かりやすい名前を記入
• URL: ページのURL、他のページと被らないURLを記入
• ファイル名: このページで使用するファイル名を半角英数字で記入

新しくブロックを作成する場合は次の2つの情報を記入。

• ブロック名: 分かりやすいブロック名を記入
• ファイル名: ファイル名、半角英数字で記入