ＷＰで現在表示中ページを判定

Question

初めて質問させていただきます。

現在、Wordpressでサイトを作成中です。
CSSでヘッダーのアコーディオンメニューを作成しております。
ＰＣ表示の時に!、そのページにいるとき、メニューバーの下に印が出るように、と指示があります。イメージ説明

以下の手順で上手く設定しましたが、
メニューバーの下に表示がでずに悩んでおります。

1：下記サイトを参考に、ヘッダーとCSSにコードを追加
（参考サイト：http://www.gl0ssy.net/wordpres-class-carrent/）

親ページ名：about
■ＨＴＭＬ

<ul id="dropmenu"> <li class="<?php if ( is_category('about') ) { echo ' current'; } ?>"><a href="/"><img src="<?php bloginfo('template_url'); ?>/img/common/about.png"></a> <ul> <li><a href="<?php bloginfo('url'); ?>/（任意のスラッグ）/">（任意の名前）</a></li> <li><a href="<?php bloginfo('url'); ?>/（任意のスラッグ）/">（任意の名前）</a></li> <li><a href="<?php bloginfo('url'); ?>/（任意のスラッグ）/">（任意の名前）</a></li> </ul>

※<?php if ( is_category('page') ) { echo ' current'; } ?>を試し済み

■ＣＳＳ
.current{
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #096;
}

2：ＷＰにログイン後、固定ページで、aboutページを作成、スラッグをaboutにして
任意のページを階下に入れる

アコーディオンメニューを設定し、現在表示しているページの下に下線を表示することは初めての試みなので、技術的に可能なのか、またどう修正すればいいのか分かりません。

お手数ですが、ご教授よろしくお願い致します。

Comments

[m.ts10806]

「表示が出ずに」とはブラウザから該当架所をソース確認しても「current」が出ていないということですか？

[koka]

ソースを確認した所、currentという表示は出ませんでした。現在、次のようになっております。<ul id="dropmenu"> <li class=""><a href="/"><img src="http://***********/img/common/about.png"></a> <ul> <li><a href="http://***********/***********/">任意の文字</a></li> <li><a href="http://***********/***********/">任意の文字</a></li>

[m.ts10806]

お願いなのですが、質問のコード部分は```で囲ってもらえますか？（コード部分選択して<code>ボタンでも可）あそういえば、あとイメージ貼ってくれてるみたいですが、表示されてません。質問編集画面で右にプレビュー出ると思うので見ながらうまく出来ているか見ながら編集してください。

[8-0_nyan5]

phpファイルを編集されていますか？

[koka]

>matsu1006さん　指摘ありがとうございます。修正致します。

[koka]

＞8-0_nyan5さん　ｐｈｐファイル・・・さわったのは、header.phpとstyle.cssのみです

[kei344]

使用されているテーマは自作テーマでしょうか？それとも公開されているテーマでしょうか？後者の場合は入手先をリンクつきで質問文に追記してください。

[koka]

>kei344さん　自作テーマです。

[kei344]

テンプレートはindex.phpですか？それともそれ以外でしょうか。そのコードを質問文にコードブロックで追記してください。コードブロックは ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。

Answer 1

固定ページの場合はis_page()ではないでしょうか。

<li class="<?php if ( is_page('about') ) { echo ' current'; } ?>">

関数リファレンス/is page

Comments

[koka]

ご回答ありがとうございます。
試してみましたが、やはり表示されません。
該当箇所のソースの表示が<li class="">になっております

[m.ts10806]

んーなるほど。あとはページ名・スラッグの名称が違ったりとか考えられなくはないですが・・・

[koka]

>matsu1006さん
念のために、ページ名もスラッグもaboutにしてみたけどダメでした。

Answer 2

「jQuery＋居場所」というキーワードで、いろんなページを検索し、試作したものの。やはり取得できず。

headerを各カテゴリ分複製。そのページにアクセスした際、.current表示がされているように、該当箇所にcurrent表示を設定。
スマートなやりかたではないですが、無事current表示されました