環境
EC-CUBE: 3.0.15
デフォルトテンプレート環境において自作のCSSを組み込む方法について説明します
default_frame.twigのコピー
[EC=CUBEインストールルート]/
src/Eccube/Resource/template/default/default_frame.twig
を
[EC=CUBEインストールルート]/
app/template/default/default_frame.twig
配下にFTPソフト等を利用してコピーします。
default_frame.twigの修正(追記)
コピーしたdefault_frame.twigの48行目の後に追加したいcssファイル名を追記します。下記ソースは「add.css」と言う名前のcssファイルを追加する為の記述になります。
1 2 3 4 5 6 7 8 9 10 |
{% block meta_tags %}{% endblock %} <link rel="icon" href="{{ app.config.front_urlpath }}/img/common/favicon.ico"> <link rel="stylesheet" href="{{ app.config.front_urlpath }}/css/style.css?v={{ constant('Eccube\\Common\\Constant::VERSION') }}"> <link rel="stylesheet" href="{{ app.config.front_urlpath }}/css/slick.css?v={{ constant('Eccube\\Common\\Constant::VERSION') }}"> <link rel="stylesheet" href="{{ app.config.front_urlpath }}/css/default.css?v={{ constant('Eccube\\Common\\Constant::VERSION') }}"> <!-- 以下の一行を追加 --> <link rel="stylesheet" href="{{ app.config.front_urlpath }}/css/add.css?v={{ constant('Eccube\\Common\\Constant::VERSION') }}"> <!-- for original theme CSS --> |
自作CSSの配置
[EC=CUBEインストールルート]/
html/template/default/css
配下に作成したcss(当説明では「add.css」)を配置します。
この手順で自作CSSを利用する事ができます。