pules designing

pules designing – データに強い奈良のWebサイト制作

[やや難]デザイン変更の方法

レイアウトHTMLの変更

/app/View/Layouts/default.ctpを変更する

画像ファイルの追加

画像ファイルは/app/webroot/img/に追加する

なお、ctpファイルからの画像ファイルへのアクセスは、以下のように記述する

~.pngの部分はimgフォルダの中のパスと合わせること

<?php echo $this->Html->image('~.png', array('alt' => 'test')); ?>

 CSSの変更

/app/webroot/css/フォルダの中のmain.cssを変更します。

Squeeze Estimation+ではTwitter Bootstrapを使用していますので、Bootstrapの機能を利用することも可能です。

参考) CSS – Bootstrap

送信メール内容の設定

見積もりがあったときの送信メールの内容を変更するには、/app/View/Emails/text/estimate.ctpを変更する。

なお、見積もりフォームの項目に増減があった場合には、$content[‘~’]の内容も合わせて変更すること。

<?php echo $name; ?>御中

下記の通り御見積り依頼がありました。

【会社名】
<?php echo $content['company']; ?>

【氏名】
<?php echo $content['name']; ?>

【メールアドレス】
<?php echo $content['email']; ?>

【電話番号】
<?php echo $content['phone']; ?>

【問い合わせ内容】
<?php echo $content['body']; ?>

 

見積もりフォームのカスタマイズ

見積もりフォームのカスタマイズを行うには、フォーム項目を作成して、埋め込みコードを必要なファイルに埋め込む作業が必要となる。

手順は以下の通り。

  1. フォームに入力させる情報を決定する
  2. 管理画面にアクセスし、項目の追加を行う。
    estimation-form1
  3. estimatesテーブルに変更した内容を元に、/app/Model/Estimate.phpを修正し、追加項目に対してバリデーションが必要であれば設定する。
    参考 ) CakePHP データバリデーション
  4. estimatesテーブルに変更した内容を元に、/app/View/Elements/home_estimate.ctpを変更する。
    参考 ) CakePHP ビュー
  5. estimatesテーブルに変更した内容を元に、/app/Controller/EstimatesController.phpの下記の部分を変更する。
    ※送信メールの内容に利用される。

    $data = array(
            'name' => $value, 
            'content' => array(
              'company' => $request['Estimate']['company'], 
              'name' =>  $request['Estimate']['name'], 
              'email' =>  $request['Estimate']['email'], 
              'phone' =>  $request['Estimate']['phone'], 
              'body' =>  $request['Estimate']['body']
            )
          );

     

  6. 送信メールの内容を変更する

掲載ページ設定

掲載ページを変更するには

/app/View/Pages/~.ctpを変更する。

なお、CakePHPでは、ファイル名とURLが次のように関連している。

ファイル名URL
/app/View/Pages/home.ctphttp://あなたのドメイン/pages/home
/app/View/Pages/merit.ctphttp://あなたのドメイン/pages/merit
/app/View/Pages/termsofuse.ctphttp://あなたのドメイン/pages/termsofuse

各ctpファイルは少量のPHPコードとHTMLコードで書かれているので、内容を確認して編集すること。

掲載ページを追加するには

ctpファイルを/app/View/Pages/~に追加すると、自動的にhttp://あなたのドメイン/pages/追加したファイル名でアクセスできるようになる