webサイト制作の勉強|2023年11月クラス用ブログ

ファリカテクニカルアカデミーのwebサイト制作科の授業解説ブログです。フェリカテクニカルアカデミーは池袋にある求職者支援訓練の学校です。

wordpressのナビゲーションにカレント表示を加える

通常のサイトであれば以前やったように各ページのg-nav liにcurrentというクラス名を付与すれば良いのですが、wordpressのようにナビゲーション部分をテンプレート化している場合、すべてのページのナビゲーションは同じnav.phpを呼び出しているので、wpテンプレートタグを使って動的に変更する必要があります。

トップページにcurrentを付与する場合

トップページの場合、is_front_page を使用します。

<?php if( is_front_page() ) echo ' class="current"'; ?>

今回はli要素にcurrentを付与したいので

<li <?php if( is_front_page() && is_home() ) echo ' class="current"'; ?> ><a href="#">top</a></li>

固定ページにcurrentを付与する場合

固定ページの場合、is_page を使用します。例えば、固定ページのスラッグが springの場合は次のコードを追加します。

<?php if( is_page('spring') ) echo ' class="current"'; ?>


なので

<li <?php if( is_page('spring') ) echo ' class="current"'; ?> ><a href="#">spring</a></li>