CakePHP4のフラッシュメッセージの表示場所、デザインを変更する方法を解説
CakePHP4の画面上部に表示されるフラッシュメッセージのデザインを改変する方法
下記の画像の箇所に表示されるエラーなどのメッセージを、「フラッシュ(Flash)メッセージ」と呼びます。
このフラッシュメッセージを表示させる場所や、デザインを変更する方法について解説します。
CakePHPのフラッシュメッセージ表示の概要
フラッシュメッセージは、Controller内に記述した
$this->Flash->error(__('The ***** could not be saved. Please, try again.'));
の処理で実行されたものが表示されます。
表示する側の処理は、レイアウト「/templates/layout/default.php」に記述されている
$this->Flash->render();
の場所に表示されます。
さらに、メッセージが表示される HTML部分として読み込まれるテンプレートファイルが
「/templates/element/flash/******.php」
になります。
この記事は、CakePHP4向けの記事として書いています。
ですが、CakePHP3でも基本的な処理は同じです。
ただ、CakePHP3のテンプレートが置いてあるフォルダの場所、および、拡張子が下記のように異なっています。その点を読み替えてください。
「/src/Template/Element/Flash/******.ctp」
また、フラッシュに関する CookBookは下記になります。
CakePHP3 フラッシュ
リクエストとレスポンスオブジェクト
https://book.cakephp.org/3/ja/controllers/components/flash.html
CakePHP4 フラッシュ(FlashComponent)
リクエストとレスポンスオブジェクト
https://book.cakephp.org/4/ja/controllers/components/flash.html
CakePHP4 フラッシュ(FlashHelper)
リクエストとレスポンスオブジェクト
https://book.cakephp.org/4/ja/views/helpers/flash.html
フラッシュメッセージは Controller内で$this->Flash->***();
で記述
フラッシュメッセージの処理は、下記を Controller内に記述するところから始まります。
1 2 |
// 基本形 $this->Flash->******("メッセージ"); |
上記が基本形です。
「******」の部分は、表示させるテンプレートのファイル名と対になるエレメント名を指定します。
デフォルトでは下記などが登録されています。
1 2 3 4 5 6 7 8 |
// 成功メッセージ $this->Flash->success("成功メッセージ"); // エラーメッセージ $this->Flash->error("エラーメッセージ"); // デフォルトメッセージ $this->Flash->set("デフォルトメッセージ"); |
フラッシュメッセージは「default.php」内の$this->Flash->render();
で受け取る
Controllerで記述した「$this->Flash->***();
」の処理は、デフォルトでは、レイアウトファイル
「/templates/layout/default.php」
に記述されている
「$this->Flash->render()
」
の場所に表示されます。
「$this->Flash->render()
」の記述は、レイアウトファイルだけではなく、それ以外のテンプレートファイル「/templates/Topics/add.php」などに記述することもできます。
「$this->Flash->render()
」の記述が、
レイアウトファイル「default.php」
テンプレートファイル「add.php」
のいずれにも記述がある場合、テンプレートファイルの方が優先されます。
また、一つのファイルの中に 2ヶ所に記述がある場合は最初に記述されている処理の方が優先されます。
詳細な HTML部分のテンプレートファイル「/templates/element/flash/*****.php」
Controller内に記述した
$this->Flash->******("メッセージ");
の処理に対応して最終的に表示されるテンプレートファイルは
「/templates/element/flash」フォルダ内にある「*****.php」になります。
$this->Flash->error("メッセージ");
の場合は、対応するテンプレートファイルは「error.php」になります。
また、メソッド名、テンプレートファイルはそれぞれ対応するように記述されていれば、自由に名称を付けることができます。
例えば、
$this->Flash->errorPublics("メッセージ");
の場合は、対応するテンプレートファイルは「success_publics.php」になります。
メソッドの記述はキャメルケース形式で、ファイル名はアンダースコアで区切る形式で記述します。
(メソッドもアンダースコアで区切る形式でも動作はしますが、規約上はキャメル形式で記述する必要があります。)
フラッシュメッセージのテンプレートファイルの CSSの変更
例えば、使用するテンプレートファイルが「error.php」の場合は、下記の記述の場所にメッセージが編集されます。
1 |
<div class="message error" onclick="this.classList.add('hidden');"><?= $message ?></div> |
処理される CSSは Classで指定されている「message error」になります。
オリジナルの CSSを割り当てたいときは、テンプレートファイルを開いて、divタグの Classを指定することで対応が可能です。
CakePHP4の関連記事
CakePHP4系でJSONレスポンスの処理ではwithStringBodyを使う。3との違い解説CakePHP4、CakePHP5の「warning: DebugKit is disabling...」の対処方法
MySQL+CakePHPのdate型、datetime型項目は「2999-12-31」までしか扱えない
CakePHP4のFrozenDateで1ヵ月前、先月、今月1日、来月末の日付などを算出する方法
CakePHP4のcake cache clear_allでPermission deniedはパーミッションの変更が必要
CakePHP4のクリエビルダーを使用してOR条件をAND条件でつなぐSQL文を作る方法
CakePHP4のController内でViewテンプレート、レイアウトの変更設定を記述する方法
CakePHP4から外部のデータベースにアクセスする方法解説
CakePHP4の数値項目は「like %10%」の部分一致検索(find select)はできない
CakePHP4でロギングスコープやログレベルを使用してログを出し分ける方法を解説
その他の「CakePHP4」に関する記事一覧
GoogleAdwords
GoogleAdwords
この記事が参考になったと思いましたらソーシャルメディアで共有していただけると嬉しいです!
関連記事
-
-
CakePHP 2.3 連携先のテーブルの項目で条件抽出する場合
アソシエーション(連携)している先のテーブルの項目で条件抽出する際の考え方と注意点をサンプルソースを用いて説明しています。
-
-
CakePHP3でCookieを保存、呼び出し、削除の操作・CakePHP3.7対応
CakePHP3.7でCookieを保存、取り出し、削除する方法を解説。CakePHP3でのCookieの取り扱いはバージョンごとに変更されるため、環境に合わせた方法を探す必要がある。
-
-
CakePHP 2.3で確認画面付きのお問い合わせフォームの作り方
CakePHPで確認画面付きのお問い合わせフォーム、メールフォームの作り方をサンプルを提示しながら解説。
-
-
CakePHP3のプラグイン「CakeDC/Users」を日本語化・翻訳ファイルもダウンロード可
CakePHP3のユーザ管理、ログイン認証プラグインである「CakeDC/Users」のメッセージを日本語にする手順の解説とともに、日本語の翻訳ファイルを提供。ファイルを設置すれば日本語になる!
-
-
CakePHP4のメッセージ日本語化の設定(国際化と地域化の機能の使い方の解説)
CakePHP4の英語のメッセージを日本語化(多言語化)する手順を解説。オリジナルのメッセージを作成する方法やプログラムで文言を追加する場合の対応なども解説。
-
-
CakePHP3で環境変数を設定して本番環境と開発環境を分けて処理をする場合
CakePHP3で開発環境と本番環境とで違う設定ファイルを読み込ませて環境ごとに定数を切り替える方法を解説。Apacheのhttpd.confに環境変数を設定し、それを読み込み判別する。
-
-
CakePHP3にデイトピッカー jQuery UI DatePickerを実装する手順の解説
CakePHP3にjQuery UIのDatePickerを実装する手順を説明。併せて、デイトピッカーを設置に関連するCakePHP3の解説と、テーマを変更したり、表記を変更するカスタマイズする方法なども紹介。
-
-
CakePHP3にデザインテンプレートBootstrapを導入する方法・friendsofcake/bootstrap-ui使用
CakePHP3にプラグイン「friendsofcake/bootstrap-ui」、デザインテンプレート「Bootstrap」を設置する手順を解説。Bootstrapの簡単な使い方やデフォルトのデザインとの混在方法なども解説。
-
-
CakePHP3で画像・ファイルのアップロード処理を自作・解説付き・その2
ファイルのアップロード機能の自作サンプルコードとその解説のその2。アップロード機能に関連するファイルの更新や削除の処理や画像、フォルダのパスの指定方法などを含めて解説。
-
-
CakePHP3でPHPExcelを使ってエクセルファイルを生成、出力する方法
CakePHP3でPHPExcelを利用してエクセルを編集、出力するサンプルソース+解説。PHPExcelのインストール方法の解説からファイル保存とダウンロードの方法なども解説。