【About】
WordPressの wp_get_archives('type=monthly') で月別のリスト<li>を生成する際に、特定の年月のアーカイブページを表示した際に<li>に特定のクラス(class="active"など)を設定する方法を記載します。また、おまけとして、functions.phpによらず、テンプレートで<li>をカスタマイズする方法も記載します。
【通常の書き方】
<WordPress>
ーテンプレート<p>月別アーカイブ</p> <ul> <?php wp_get_archives('type=monthly')); ?> </ul>
とすると
<HTML>
<p>月別アーカイブ</p> <ul> <li><a href="http://hoge.com/2013/12/">2013年12月</a></li> <li><a href="http://hoge.com/2013/11/">2013年11月</a></li> </ul>
などと生成されます。
これを、ある月を表示しているときに、該当のリスト<li>に class="active" を追加したいとします。
【カスタマイズ方法】
<WordPress>
ーテンプレート<p>月別アーカイブ</p> <ul> <?php wp_get_archives('type=monthly')); ?> </ul>(変更なし)
ーfunctions.php
functions.phpに以下を追加
<?php ・・・ function my_archives_link($link_html){ $my_month = '/' . get_query_var('year') . '/' . get_query_var('monthnum'); if (strstr($link_html, $my_month)) { $link_html = preg_replace('@<li>@i', '<li class="active">', $link_html); } return $link_html; } add_filter('get_archives_link', 'my_archives_link'); ・・・ ?>
解説
引数で渡される $link_html(<li><a href="...">...</a></li>)に対し、当該記事の年(get_query_var('year'))と月(get_query_var('monthnum'))を取得し、当該年月が含まれていた場合は<li>を<li class="active">に書き換える。
すると2013年12月のアーカイブページを表示しているときには展開されるHTMLは以下のようになります。
<HTML>
<p>月別アーカイブ</p> <ul> <li class="active"><a href="http://hoge.com/2013/12/">2013年12月</a></li> <li><a href="http://hoge.com/2013/11/">2013年11月</a></li> </ul>
【おまけ】
また、すべての<li>に共通でなにかを追加したい場合は、(上記のようにfunctions.phpを編集してもよいですが)テンプレートで簡単に以下のように記述すればOKです。【functions.phpではなく、テンプレートでカスタマイズする方法】
<WordPress>
ーテンプレート<ul> <?php echo str_replace('</a></li>', '<i class="arrow"></i></a></li>', wp_get_archives('type=monthly&echo=0')); ?> </ul>
するとHTMLは以下のように展開されます。
<HTML>
<ul> <li class="active"><a href="http://hoge.com/2013/12/">2013年12月<i class="arrow"></i></a></li> <li><a href="http://hoge.com/2013/11/">2013年11月<i class="arrow"></i></a></li> </ul>
以上です。
皆様、よいお年を!
そして2014年が明るい年になりますように!
コメント
コメントを投稿