フォームの見た目を変える
ということで無事 members の会員登録部分が動くようになりました。 すぐに気づくことですが、デフォルトのテンプレートの見た目が気に入らないです。 会員の一覧画面はともかく、 /members/add の登録画面とか。 見た目の整形は最後にまとめてやっても構わない訳ですが、なんだかこのまま作業するのも気が重い。 ここでちょっといじりたい、というのが人情でしょう。 とりあえず、アクション add の場合で言うと、今自動生成されたテンプレートはこうなっています。
<fieldset>
<legend><?php __('Add Member'); ?></legend>
<?php
echo $this->Form->input('email');
echo $this->Form->input('password');
echo $this->Form->input('type_id');
echo $this->Form->input('birthday');
echo $this->Form->input('img1');
echo $this->Form->input('img2');
echo $this->Form->input('Favorite');
?>
</fieldset>
fieldset とか legend が気に入らないですね。 ということで、本家サイトのドキュメントにあるとおり、デフォルトのテンプレートをコピーして、編集します。
9.3 Modify default HTML produced by "baked" templates
先に、/app/vendors/shells/templates/ 以下に、自分が作るテンプレート用のディレクトリを作っておきます。
ここでは
/app/vendors/shells/templates/mythemeとしました。
そして、
cd Sites/cake/cake/console/templates/default cp -r views /Users/myname/Sites/cake/app/vendors/shells/templates/mytheme/viewsとして、デフォルトのテンプレートを自分のところへコピーします。
上記 views の中にある form.ctp を開いて、
<fieldset>
<legend><?php printf("<?php __('%s %s'); ?>", Inflector::humanize($action), $singularHumanName); ?></legend>
<?php
echo "\t<?php\n";
foreach ($fields as $field) {
if (strpos($action, 'add') !== false && $field == $primaryKey) {
continue;
} elseif (!in_array($field, array('created', 'modified', 'updated'))) {
echo "\t\techo \$this->Form->input('{$field}');\n";
}
}
if (!empty($associations['hasAndBelongsToMany'])) {
foreach ($associations['hasAndBelongsToMany'] as $assocName => $assocData) {
echo "\t\techo \$this->Form->input('{$assocName}');\n";
}
}
echo "\t?>\n";
?>
</fieldset>
こうなっているところを、
<h2><?php printf("<?php __('%s %s'); ?>", Inflector::humanize($action), $singularHumanName); ?></h2>
<?php
echo "\t<?php\n";
foreach ($fields as $field) {
if (strpos($action, 'add') !== false && $field == $primaryKey) {
continue;
} elseif (!in_array($field, array('created', 'modified', 'updated'))) {
echo "\t\techo \$this->Form->input('{$field}');\n";
}
}
if (!empty($associations['hasAndBelongsToMany'])) {
foreach ($associations['hasAndBelongsToMany'] as $assocName => $assocData) {
echo "\t\techo \$this->Form->input('{$assocName}');\n";
}
}
echo "\t?>\n";
?>
とします。
fieldset と legend を削除して、h2 に変えたってだけです。 再度 cake bake でビューを作り直します。
前回同様yes-noで進んでいくと、今度は、以下のようにテンプレートが選べるメニューが出ます。
--------------------------------------------------------------- You have more than one set of templates installed. Please choose the template set you wish to use: --------------------------------------------------------------- 1. mytheme 2. default Which bake theme would you like to use? (1/2) [1] > 1自分が作ったテンプレートを選びます。
/app/views/members/add.ctp を確認すると、
<h2>
<?php __('Add Member'); ?></h2>
<?php
echo $this->Form->input('email');
echo $this->Form->input('password');
echo $this->Form->input('type_id');
echo $this->Form->input('birthday');
echo $this->Form->input('img1');
echo $this->Form->input('img2');
echo $this->Form->input('Favorite');
?>
自分用のテンプレートが適用されています。
