ITOBEN STYLE > EC-CUBE4 > EC-CUBE4:デザインテンプレートのインストール 2018年10月31日カテゴリー: EC-CUBE4 EC-CUBEプラグイン EC-CUBEデザインテンプレート EC-CUBE4:デザインテンプレートのインストール 3種類のデザインテンプレートから選択 まず初めに、3種類のデザインテンプレートの中から適用するテンプレートを決めて下さい。 —————————- DT4A100-No1.tar.gz DT4A100-No2.tar.gz DT4A100-No3.tar.gz —————————- 3種類のテンプレートは、ヘッダー部のデザインが異なりますが、その他は同じです。 グローバルメニューには3つのデザインがあり、インストール後に変更することができます。 ↓DT4A100-No1.tar.gz ↓DT4A100-No2.tar.gz ↓DT4A100-No3.tar.gz デザインテンプレートのアップロード (1)オーナーズストア > テンプレート > アップロード (2)コード・名称の入力とファイルのアップロード テンプレートコード:半角英数字、名称は自由。 テンプレート名:日本語可、名称は自由。 テンプレートファイル:********.tar.gzを選択 (3)右下の「登録」をクリック。 (4)テンプレート一覧のラジオボタンをチェックし、「登録」。 上図のように3種類のテンプレートをアップロードし、実際のデザインを確認してから確定することも可能です。 テンプレートを登録するとテンプレートコード名でフォルダが2つ生成されます。 カスタマイズを行う際は、このフォルダのファイルを編集することになります。 ■app/template/[テンプレートコード] ←twigファイル ■html/template/[テンプレートコード] ←assets(css icon img js scss) プラグインがインストールされている場合の注意 プラグインによっては、twigファイルが生成されるものがあります。生成されているtwigファイルをデザインテンプレートのフォルダにコピーしないとシステムエラーとなりますので注意して下さい。 ▼たとえば上図では デザインテンプレート適用前にインストールされた「おすすめ管理プラグイン」のrecommend_product_block.twigがdefaultフォルダに生成されているので、それをテンプレートフォルダにコピーしています。 また、管理画面のブロック管理で作成したtest.twigも同様にコピーしています。
3種類のデザインテンプレートから選択
まず初めに、3種類のデザインテンプレートの中から適用するテンプレートを決めて下さい。
—————————-
DT4A100-No1.tar.gz
DT4A100-No2.tar.gz
DT4A100-No3.tar.gz
—————————-
3種類のテンプレートは、ヘッダー部のデザインが異なりますが、その他は同じです。
グローバルメニューには3つのデザインがあり、インストール後に変更することができます。
↓DT4A100-No1.tar.gz
↓DT4A100-No2.tar.gz
↓DT4A100-No3.tar.gz
デザインテンプレートのアップロード
(1)オーナーズストア > テンプレート > アップロード
(2)コード・名称の入力とファイルのアップロード
テンプレートコード:半角英数字、名称は自由。
テンプレート名:日本語可、名称は自由。
テンプレートファイル:********.tar.gzを選択
(3)右下の「登録」をクリック。
(4)テンプレート一覧のラジオボタンをチェックし、「登録」。
上図のように3種類のテンプレートをアップロードし、実際のデザインを確認してから確定することも可能です。
テンプレートを登録するとテンプレートコード名でフォルダが2つ生成されます。
カスタマイズを行う際は、このフォルダのファイルを編集することになります。
■app/template/[テンプレートコード] ←twigファイル
■html/template/[テンプレートコード] ←assets(css icon img js scss)
プラグインがインストールされている場合の注意
プラグインによっては、twigファイルが生成されるものがあります。生成されているtwigファイルをデザインテンプレートのフォルダにコピーしないとシステムエラーとなりますので注意して下さい。
▼たとえば上図では
デザインテンプレート適用前にインストールされた「おすすめ管理プラグイン」のrecommend_product_block.twigがdefaultフォルダに生成されているので、それをテンプレートフォルダにコピーしています。
また、管理画面のブロック管理で作成したtest.twigも同様にコピーしています。