どうも、チャーさんです。
あなたはwordpressのメニューにcurrentという、
クラス名を現在表示してるページのメニューにだけ、
つける方法を探していませんか?
この記事では、現在表示してるページのメニューに
currentというクラスをふる方法を書いています。
なのであなたがこの記事を読めば、
表示されてるページのメニューだけ、
目立たせるデザインをcssでつける。
みたいなことができるようになります。
ということで、あなたがwordpressの現在表示
ページのメニューにcurrentをつけたければ、
このまま下にスクロールして読んでみてください。
スポンサードサーチ
目次
wordpressのメニューにcurrentをつける方法
ということで結論からです。
wordpressでメニューにcurrentをつけるには、
ワードプレスの組み込み関数を使えばつけれます。
例えば、
<?php if(is_page(“sample”)){
$current =”current”;
}
<li class=”<?php echo $current; ?>”>サンプルページ</li>
のように書いておけば、
サンプルページという名前の固定ページを、
表示してる時に、
サンプルページという名前のメニューに、
currentをつけることができます。
で、あとはそのメニューが表示されてると
わかりやすいようにcssを使って色をつけたり、
下線を引いたりしておけば、
現在表示してるページと、メニューの中で
目立たせることができます。
カテゴリーページをメニューとして表示してる場合
で、上記はナビゲーションメニューに、
固定ページをメニューとして表示していた場合の話で、
他にカテゴリーページを表示する場合もあると思います。
その場合は、is_archive()と書けばいいですし、
<?php if(is_archive(“test”)){
$current =”current”;
}
<li class=”<?php echo $current; ?>”>テストカテゴリー</li>
トップページをメニューとしてる場合
もしトップページをメニューとして表示してる場合は、
is_home()を使えばいいでしょう。
<?php if(is_home()){
$current =”current”;
}
<li class=”<?php echo $current; ?>”>トップページ</li>
と書けば良いです。
is_page()、is_archive()とはなに?の補足
ちなみに「上記のis_pageとかis_archiveとはなに?」
と疑問に思った方のために、
ちょいと補足説明を入れておきますが、
上記のis_pageとかis_archiveというのは、
is_page()…固定ページが表示されてたら、
is_archive()…カテゴリーページが表示されてたら
と判別してくれるwordpressが用意してくれてる
関数です。
なのでこれとif文を組み合わせれば、
固定ページが表示されてる時のみ、
指定した処理をする、みたなのが可能で、
これを使えばあなたの思ったようにカスタマイズできる、
というものです。
そして今回のcurrentはそれを使って、
狙ったページの時だけcurrentというクラスを
表示させてるという仕組みですね。
どのファイルに書き込めばいいかについて
で補足はここで一旦終わりまして、
じゃあ実際どこに上記を書き込むかですが、
ナビゲーションメニューを表示させてるファイル
に対して、書き込みましょう。
例えばheader.phpとかで、
ナビゲーションメニューを表示させてるなら、
そこに一緒に書いておけばいいです。
するとcurrent表示ができるので、
あとは、あなたの好きなようにcssで、
デザインするだけです。
スポンサードサーチ
まとめ
ということでまとめに入ります。
wordpressのメニューにcurrentを表示させるには、
wordpressの組み込み関数を使いましょう。
そうすればcurrentをclassに表示し、
現在表示ページのメニューにデザインをつける、
というカスタマイズが可能になります。
ということで仕組みややり方がわかったと、
思いますので、早速あなた自身でもやってみましょう。
ということでまずはメニューが固定ページなのか、
カテゴリーページなのかそれを確認しましょう。
確認方法は、wordpressの管理画面の、
外観>メニューから入ればメニューの項目が表示されてるので、
そこをみたらわかります。
で固定ページをメニューとして表示してるなら、
is_page()を
カテゴリーページならis_archive()を使ってみましょう。
で例えば固定ページのslug(パーマリンクの一番端の部分)
をsampleとかにしてるなら、is_page(‘sample’)とすれば、
その固定ページが表示されてるとき、というカスタマイズができます。
ので、スラッグ名を()内に入れましょう。
であとは、classにechoするだけです。
ということでwordpressでメニューに、
currentを表示する方法でした。
それでは、読んでもらってありがとうございました。
チャーさん