CakePHP3でCSSを反映させたい - 29歳からエンジニア目指すブログ

CSSを書いていこう、と思ったら、CSSが反映されないってことありますよね。

かなり萎えますし、不安になります。

ちょっとした設定が必要なので、それをご説明します。

【自分の環境】
macOS Catalina
PHP7.4.2
CakePHP3.8
MAMP5.7
Apache2.2
MySQL5.7

cssファイルを配置してください。

当たり前ですが、処理も書き込んでおきましょう。

こんなかんじで読み込みを宣言します。

（ビューテンプレートもしくはレイアウトテンプレート）

<head>
   （中略）
    <?php
        echo $this->Html->css('reset');
        echo $this->Html->css('mypage');
    ?>
   （中略）
</head>

headタグ内でphpタグで囲みながら$this->Html->css('reset');などと書きます。

今回はreset.cssとmypage.cssを読み込んでいます。

これでテンプレートでの読み込み宣言はOKです。

キャッシュが有効になっていると、CSSが反映されません。

app.phpにあるassetのタイムスタンプのコメントアウトを外し、以下のように設定しましょう。

'Asset' => [
        'timestamp' => true,
        // 'cacheTime' => '+1 year'
    ],

これでキャッシュが無効化されて反映するはずです。

以上となります。

CSSを書き始める時に陥りがちな点について説明しました。

もし反映されなかったら試してみてください。

ありがとうございました。