45式::雑記
45式::雑記は、日々の事を記してないから日記ではなく雑記です。

wp.Vicuna Extとwp.Vicuna.excのグローバルナビゲーションでカレント表示

コメント
0件
トラックバック
0件

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]

トラックバックはまだありません。

カテゴリ
アーカイブ
ヘルプ
Feed

フィードとは