ヘッダー共通テンプレート化したいけど、CSSがちょっと違うな~
とうわけで今回は条件分岐を使って特定のclass名を付ける方法について説明します。
実案件ではヘッダーの背景デザインがちょっと違うときに使用しました。
大きくデザインが違っていれば、テンプレートを分けることも考えましたが
本当に背景のちょっとした違いだったので条件分岐で対応しました。
目次
条件分岐を使って特定のclass名を付ける
実際のコード例
では早速実際に使用したコードを貼り付けます↓
<div <?php if(is_page('front-page')) : ?>
class="head_wrap background-image" <?php else :?> class="head_wrap"
<?php endif; ?>>
is_page()は固定ページを呼び出すWordPressの関数です。
今回はトップページ(front-page)とそれ以外の固定ページで条件分岐しております。
is_page(‘front-page’)で固定ページが’front-page’だった場合、trueを返すのでclass名「”head_wrap background-image”」を
divに付けます。それ以外には「”head_wrap”」というclass名を返してくれます。
まとめ
というわけで今回は条件分岐(if)を使って特定のclass名を付けるお話でした。
if文は実案件ではめちゃくちゃ使うのでしっかり覚えておきましょう!!