WordPressのウィジット「アーカイブ」でも過去記事の月別・年別アーカイブを取得できますが、ウィジットを使わずに自分でいろいろカスタマイズしたいときのためのメモです。

WordPress固有の関数を使ったときに、どのようなidやclass名が付き、またどのようなHTML構造で吐き出されるか、まだまだ全然覚えられなかったり、var_dump()しないとわからないので、自分用のまとめを兼ねて作りました。

執筆時のWordPressのVersionは、4.9です。

wp_get_archives()関数とは

wp_get_archive()は、年別、月別、週別、日別など、期間ごとの記事のアーカイブを取得するための、WordPress独自の関数です。
wp_get_archives() | Function | WordPress Developer Resources
テンプレートタグ/wp get archives – WordPress Codex 日本語版

wp_get_archives( string|array $args = '' )

以前はget_archives()が使われていたようですが、現在は非推奨です。
get_archives() | Function | WordPress Developer Resources(※非推奨関数)

wp_get_archives()で出力されるHTML

デフォルト設定で、wp_get_archives()と記述したときに出力されるHTMLは、たとえば、以下の通り。

<li><a href="http://example.com/2017/11/">2017年11月</a></li>
<li><a href="http://example.com/2017/10/">2017年10月</a></li>
<li><a href="http://example.com/2017/09/">2017年9月</a></li>
<li><a href="http://example.com/2017/08/">2017年8月</a></li>
<!-- 以下、略 -->

<ul> ~ </ul>ではくくられず、リスト要素のみ(<li>)が出力されます。
リスト要素の中身は、月別アーカイブへのリンク(<a>)になっており、idやclassは付きません。

wp_get_archives()の引数とデフォルト値

wp_get_archives()とだけ記述した場合、引数のデフォルト値は以下のように設定されています。

<?php 
wp_get_archives( array( 
  'type' => 'monthly', //他に、'daily', 'weekly', 'yearly', 'postbypost', 'alpha'が設定可能
  'limit' => '' //アーカイブを何件まで取得するか(typeに応じて、何日、何ヶ月、何年など). デフォルトはnullで、あるだけ取得
  'format' => 'html' //<a>タグを何でくくるかを設定.他に、'link' (<link> tag), 'option' (<option> tag), 'custom'が設定できる
  'before' => '' //デフォルトはnull.<li><a>~</a></li>以外の形で<a>タグをくくりたいときに、設定する
  'after' => '' //同上
  'show_post_count' => false //アーカイブ件数を表示するかしないか. 表示させたい場合はtrueに.
  'echo' => '1' //関数で取得した値を出力するかしないか.したくないときは、'0'またはfalse指定.
  'order' => 'DESC' //古い順に出すか、新しい順に出すか.古い記事からアーカイブを出力したいときは''ASC'.
  'post_type' => '' //デフォルトは'post'、他に指定できる値の具体的な記述はなかったが、おそらく'page'など.
)); ?>

関数の中身をざっと見た感じでは、MySQLにアクセスしてデータを引っ張ってきているので、SQLへのアクセスに慣れていければ、直接自分でデータベースから必要なものを引っ張ってくるのでも、色々できそうです。

また'type' => alpha'と記述すると、すべての記事をアルファベット順に出力できるようです。(日本語環境では…あまり使う場面がなさそうですが)

引数を ‘format’ => ‘custom’にした場合

アーカイブリストへのリンクである<a>タグを、<li> ~ </li>以外のタグでくくりたい場合は、引数'format''custom'にします。

たとえば、Referenceで例として挙げられていたのは、月毎アーカイブへのリンクを<span>タグでくくり、,で区切るというものでした。

<?php 
wp_get_archives( array( 
  'format' => 'custom',
  'before' => '<span class="my-post-title">',
  'after' => '</span>, '
)); ?>

上のように指定すると(他はデフォルトのまま)、月毎のアーカイブが、以下のようなHTMLとして出力されます。

<span class="my-post-title"><a href="http://example.com/2017/11/">2017年11月</a></span>","
<span class="my-post-title"><a href="http://example.com/2017/10/">2017年10月</a></span>","
<span class="my-post-title"><a href="http://example.com/2017/09/">2017年9月</a></span>","
<span class="my-post-title"><a href="http://example.com/2017/08/">2017年8月</a></span>","
<!-- 以下、略 -->

引数を ‘echo’ => ‘0’(または、false)にした場合

運営が長いブログの場合、デフォルトのままでは、月毎のアーカイブリンクがリストとしてずらずらっと並ぶことになり、見にくくなります。

そこで、JavaScriptやCSSなどを利用し、トグル表示にするなどのカスタマイズを行いたいような場合には、HTMLコードを変数に代入しておき、それを使うようにします。
(ただ、扱いに慣れているならば、直接SQLにアクセスするような関数を自分で定義したほうが、色々と融通がきいて、便利そうです。)

たとえば、$year_archivesという変数を定義し、そこにwp_get_archives()関数の出力結果を代入し、まずは年別のアーカイブリストを取得してみます。

※以降では、構造が少しわかりやすくなるよう、引数部分のarray()$args =と定義してから書いています。↓

<?php 
$args = array(
  'type' => 'yearly', //年別アーカイブ
  'echo' => 0, //結果を出力させない
);
$yearly_archives = wp_get_archives($args);
?>

上のように設定すると、$year_archivesは、以下のような文字列を持った、String型になります。

<li><a href="http://example.com/2017/">2017</a></li>
<li><a href="http://example.com/2016/">2016</a></li>
<li><a href="http://example.com/2015/">2015</a></li>
<li><a href="http://example.com/2014/">2014</a></li>
<!-- 以下、略 -->

しかし、このままでは、カスタマイズに利用するには扱いにくかったりするので、PHPのexplode()関数を使って配列化できるよう、カンマ区切りになるような引数を設定しておくと便利かもしれません。
PHP: explode – Manual

<?php 
$args = array(
  'type' => 'yearly',
  'format' => 'custom', //<a>タグを<li>でくくらないようにする
  'before' => '',
  'after' => ',', //カンマで区切る
  'echo' => 0,
)
$yearly_archives = wp_get_archives($args);
?>

すると、$year_archivesは以下のような文字列を持ちます。

<a href="http://example.com/2017/">2017</a>","
<a href="http://example.com/2016/">2016</a>","
<a href="http://example.com/2015/">2015</a>","
<a href="http://example.com/2014/">2014</a>","
<!-- 以下、略 -->

そこで、以下のようにexplode()関数を使うことで、

<?php 
$year_archives = explode(',', $yearly_archives); //配列化
?>

array型として使えるようになります。

//explode()処理後の$year_archivesの中身
array(4) {
 [0] => "<a href="http://example.com/2017/">2017</a>"
 [1] => "<a href="http://example.com/2016/">2016</a>"
 [2] => "<a href="http://example.com/2015/">2015</a>"
 [3] => "<a href="http://example.com/2014/">2014</a>"
 [4] => "" //最後、空の配列要素ができる
}

ただし、wp_get_archives()において、末尾(after)に,を付けるように設定した結果、explode()変換後は、配列の末尾の要素がnullになっている(上記の例では[4]の部分)ので、その点、取り扱い注意です。

そのまま扱うことももちろん可能ですが、すっきりさせたい場合は、PHPのarray_pop()で配列末尾を削除してから使うのもありかと思います。
PHP: array_pop – Manual

<?php
array_pop($year_archives);
?>

これで、配列の末尾要素が削除されます。

//array_pop()処理後の$year_archivesの中身
array(4) {
 [0] => "<a href="http://example.com/2017/">2017</a>"
 [1] => "<a href="http://example.com/2016/">2016</a>"
 [2] => "<a href="http://example.com/2015/">2015</a>"
 [3] => "<a href="http://example.com/2014/">2014</a>"
}

あとは、配列化した変数を使い、カスタマイズしていきます。

▼カスタマイズ例
【WordPress】サイドバーの月別・年別アーカイブをcssとjsでスッキリさせる方法 | WordPress | マイホームブログ | Web屋の芝生DIY

まとめ

PHPやWordPressの関数などの読み方も少しずつ慣れてきているところですが、まだまだ初心者なので、wp_get_archives()関数は、どうのようなパラメータを取れるのか、パラメータを設定した結果、どのような出力が返ってくるのかをまとめました。

WordPressもバージョンが上がっていくに従い、便利な関数が増えていっているようですが、まだまだ、自分でカスタマイズする楽しさもありますね。

最後に、wp_get_archives()関数を利用したカスタマイズ例のリンクを貼らせていただきましたが、私も参考にさせていただきながら、ちょこちょこ改変したりもしているので、またカスタマイズが終了したら、コードをまとめたいと思います。

追記(2018/02/08)

wp_get_archives()を使って当サイトが行ったカスタマイズについてまとめました。

CSSやjQueryを組み合わせつつ、見た目をすっきりさせています。よろしければご覧ください。