wp.Vicuna Extとwp.Vicuna.excのグローバルナビゲーションでカレント表示
Vicunaスキンのグローバルナビゲーションは、ナビゲーション内のページ自体を表示した場合のためにcurrent
というクラスが用意されています。
<ul id="globalNavi">
<li class="current"><a href="#">About</a></li>
<li><a href="#">Archives</a></li>
<li><a href="#">Guest Book</a></li>
<li><a href="#">Bookmarks</a></li>
</ul>
そのクラスを使ってカレント表示を行う事ができるのですが、wp.Vicuna Ext.とwp.Vicuna.excではうまくいきません。
その理由は実際のソースを見てもらえばわかるでしょう。
<ul id="globalNavi">
<li><a href="http://www.example.com/">Home</a></li>
<li class="page_item page-item-1 current_page_item"><a href="http://www.example.com/about/" title="About">About</a></li>
<li class="cat-item cat-item-1"><a href="http://www.example.com/category/未分類/">未分類</a></li>
</ul>
<ul id="globalNavi">
<li><a href="http://www.example.com/">Home</a></li>
<li class="page_item page-item-1"><a href="http://www.example.com/about/">About</a></li>
<li class="cat-item cat-item-1 current-cat"><a href="http://www.example.com/category/未分類/">未分類</a></li>
</ul>
ページではcurrent_page_item
、カテゴリではcurrent-cat
と付けられるクラスの名前が異なるのです。
Vicunaスキンにはこれらのクラス名に対するスタイルが用意されていないのでカレント表示が行えません。
CSSの編集
手っ取り早い方法は、CSSファイル内にカレントページとカレントカテゴリのクラス名も追加する事でしょう。
ul#globalNavi li a:hover,
ul#globalNavi li.current_page_item a,
ul#globalNavi li.current-cat a,
ul#globalNavi li.current a {
ただ、この方法だとスキンを変更する度に修正が必要で……面倒です。
そこで、カレント表示時のクラス名がcurrent
になるようにテーマを編集してみました。
テーマの編集
以下の記述をwp.Vicuna Ext.かwp.Vicuna.excのテーマのための関数 (functions.php)ファイルに追加して下さい。
ソースは<?php
から?>
までの間に追加するよう注意して下さい。
function currentPage( $current ){
$current = preg_replace( '/current(_page_item|-cat)/', 'current', $current );
return $current;
}
add_filter( 'wp_list_pages', 'currentPage' );
add_filter( 'wp_list_categories', 'currentPage' );
WordPressにもPHPにも不慣れな素人が考えたものですが、一応自分の環境で動く事を確認しました。
コメント[0]
コメント投稿フォーム
コメントを投稿するにはJavaScirptが必要です。ブラウザのJavaScriptを有効にしてください。
トラックバック[0]
トラックバックはまだありません。
コメントはまだありません。