読者です 読者をやめる 読者になる 読者になる

ユアマイスター株式会社エンジニアブログ

ユアマイスター株式会社のエンジニアが日々徒然。

複数ページのheader一括化!

こんばんは!エンジニアインターン歩兵クラスの竹本です!
皆さんWBC盛り上がりましたか??ユアマイスター株式会社は昨日のアメリカ戦を皆で応援してましたが…残念な結果でしたね、、 その悔しさを仕事のパフォーマンスに変える。それがユアマイスター株式会社です。
さてさて、今週のあいさつはここら辺までにして今週も行きますよ!エンジニア初心者の竹本によるエンジニア初心者のためのブログ!

サイトリニューアル!

エンジニア初心者の竹本ですが、先週から「あなたのマイスター」サイトの一部分のリニューアル化を課され、毎日奮闘しています!
来週にリリースできるように頑張ります!公開したら皆さんも是非みてくださいね♪
(ちなみにやってることはview側の整理とcontrollerの変数を修正などでです。) そこで課された一つのタスクが複数ページの共通ヘッダーを一括化です。 では早速進めて行きましょう!(今回もcakePHPを仕様です)

共通ヘッダーのファイルを作成

今回はインフォーメション、リスト、ゲストページがあると仮定します。
まず各々のページでリストで指定されているヘッダーをElementの共通ページにまとめます。

//Element/header_common.ctp 
<div>
  <ul>
     <li>
         <a href="<?php echo $this->Url->build(['controller'=>'Information', 'action'=>'index']); ?>">
     </li>
  </ul>
  <ul>
      <li>
         <a href="<?php echo $this->Url->build(['controller'=>'List', 'action'=>'index']); ?>">
     </li>
  </ul>
  <ul>
     <li>
         <a href="<?php echo $this->Url->build(['controller'=>'Guest', 'action'=>'index']); ?>">
     </li>
  </ul>
   
</div>

controllerで行き先のviewディレクトリを指定してactionでその中の何のファイルに飛びたいのか決めてあげましょう。
とてもシンプルですね。これで共通化は完了です!

各々のページで共通ヘッダーを呼び出す

上で共通化したヘッダーをインフォーメション、リスト、ゲストページのヘッダー部分に呼び出しましょう!

//三種類.ctp 
<header>
<?= $this->Element('header_common'); ?>
</header>

この一文でヘッダー共通化できるんです! やってることはElementのheader_commonファイルをechoしているだけです笑

告知!

3/31にユアマイスター株式会社でTGIF Nightやります!エンジニアに興味があるっていうど初心者の方も是非いらしてください!! 何と今回竹本はスピーカーとしてエンジニアインターンを語ります!笑 詳細は下記からご確認ください。

yourmystar-engineer.hatenablog.jp