前回から続いて、今回はレイアウト(画面)の編集を行います。
1、templatesファイルの仕組み
Symfonyでは、ヘッダやフッタのような全体で共通の表示となる
グローバルなテンプレートファイルと
各モジュールで表示する部分のテンプレートファイルで分かれています。
以下が、グローバルなテンプレートファイルです。
sf_sandbox/apps/frontend/templates/layout.php
中身を見ていただければ、だいたい分かると思いますが、
echo $sf_content となっている箇所が
各モジュールの出力結果を表示する部分です。
モジュールで処理された結果は最終的に、ここに辿りついて出力されるわけですね。
2、グローバルテンプレートファイルの修正(layout.php)
それでは、もっとこのブログが使いやすいように修正してみましょう。
以下の内容をlayout.phpの<body>タグの中に上書きして下さい
と思ったのですが、gooブログでHTMLをそのまま表示するやり方がわからないので、
原文のModify the layoutの箇所にあるHTMLを<body>タグにコピペして下さい。
これで、ヘッダが表示されたと思います。
ヘッダにはトップ画面へのリンク、
右上に、ポスト一覧、コメント一覧へのリンク。
トップ画面へのリンクは、まだ、プロジェクト作成後のSuccess画面が表示されてしまうとは思いますが。
そこはこれから修正していきます。
3、画面表示設定(HTMLのmetaタグなど)
sf_sandbox/apps/frontend/config/view.yml
view.ymlでは、このアプリのタイトル名、読み込むcss、javascriptファイルなどを設定できます。
今はまだ、画面名が「無題」とかになっていると思いますが、
titleのコメントアウトを外すと、titleに設定された文字列が
画面名になると思います。
(要はHTMLのheadで設定するtitleタグの設定です。)
HTMLがわかる人が項目名を見れば、なんとなく意味がわかると思います。
cssファイルを複数指定したい場合はカンマ「,」区切りで指定すればOKです。
cssファイルなどの静的ファイルはsf_sandbox/webにある各フォルダに配置して下さい。
4、トップ画面の設定
トップ画面がいつまでもsuccess画面では困るので、設定したいと思います。
以下のコマンドを実行して下さい。
php symfony generate:module frontend main
これで、mainモジュールが出来ました。
次に、以下のファイルを開いて下さい。
sf_sandbox/apps/frontend/modules/main/actions/actions.class.php
executeIndex()内に記述されている行をコメントアウトして下さい。
次に、以下のファイルを開いて下さい。
sf_sandbox/apps/frontend/modules/main/templates/indexSuccess.php
ここにはトップページで表示するHTMLを書きます。
内容は何でもいいですが、
原文をコピペするのがいいと思います。
目印はindexSuccess.php。
次に、以下のファイルを開いて下さい。
sf_sandbox/apps/frontend/config/routing.yml
以下のように、homepageのparamにあるmodule:の値をdefaultからmainに変更して下さい。
homepage:
url: /
param: { module: main, action: index }
これにより、frontendのhomepageを表示する時のデフォルト画面は
mainモジュールのindexアクションを実行した時の画面となりました。
これで、さっきはSuccess画面が出てしまったリンク「My first symfony project」を
クリックしてみると、indexSuccess.phpで記述した内容が表示されると思います。
常に、ポスト一覧、コメント一覧へのリンクは表示されているので、
これで、移動に困ることはありませんね!
レイアウト編集の基本はこれにて終了。
次回は、actionから処理した結果をtemplateに出力する方法について勉強します。
Symfony1.1の勉強 その5 テストアプリを作る(データの受け渡し編)