the_dateは、記事の投稿日時を表示する場合に使われる関数の1つで、
連続して記事を表示させるようなトップページ、アーカイブページで使われることが多い関数です。
the_dateを使って、記事の投稿日時を表示させている方も多いのではないでしょうか?
ですが、このthe_date関数・・・仕様にクセがあって、
記事一覧を表示させるようなループ処理でこの関数使うと、投稿日時がうまく表示されないことがあります。
ループ処理で投稿日時を表示させる方法は、the_dateの他に、the_timeやget_the_dateを使うことで投稿日時を表示させることができますが、the_dateを使った場合のみ投稿日時がうまく表示されないことがあるので、その原因と対策を探ってみました。
下の例は、記事一覧ページで使われている、the_dateを使ったソースコードです。
1 2 3 4 5 6 7 8 |
<?php /* ループ処理でthe_dateを使って投稿日時を表示させた場合のソース */ ?> <?php while ( have_posts() ) : the_post(); ?> // ← ループ処理スタート <article> <header><h1><?php the_title(); ?></h1></header> <div><?php the_excerpt(); ?></div> <footer><?php the_date(); ?></footer> // ← 投稿日時の表示に the_date() を記述 </article> <?php endwhile; ?> |
上記コードを使って、以下の条件で記事を投稿すると、100% 上図のように投稿日時が表示されなくなります。
・同じ日に連続して複数の記事を投稿する。 ・ループ処理でthe_date関数を使って投稿日時を表示する。
一日に連続して複数記事を投稿することは少ないと思うので、
ループ処理でうっかりthe_dateを使ってしまっても、この現象に気がつくことは少ないかもしれません。
一応、WordPressの裏側で処理されているthe_date関数のコードを記載しておきます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
// ファイルの場所 : /wp-includes/general-template.php /* $currentday = 投稿記事の投稿日を格納 $previousday = 投稿日時を表示する直前に$currentdayの内容を$previousdayに格納 */ function the_date( $d = '', $before = '', $after = '', $echo = true ) { global $currentday, $previousday; $the_date = ''; if ( $currentday != $previousday ) { $the_date .= $before; $the_date .= get_the_date( $d ); $the_date .= $after; $previousday = $currentday; $the_date = apply_filters('the_date', $the_date, $d, $before, $after); if ( $echo ) echo $the_date; else return $the_date; } return null; } |
PHPで書かれたコードなので、PHPに詳しくない方のために上記コードを翻訳すると、
同じ日に複数の記事を投稿した場合、同日記事の最新記事には投稿日時を表示するが、 それ以降の同日記事については投稿日時を省略する・・・
という意味になります。
コードの内容から、ループ内でthe_dateを使うと、意図してこのような処理が行われているのが読み取れました。
バグではなく、仕様としてこのような処理をしているのですね。
なかなか使いどころの難しいthe_date関数ですが、この仕様を活かしたサイトやデザインがあれば、みてみたいです。
ほとんどのサイトでは、同日投稿であろうがなかろうが記事一覧に投稿日時が表示されているケースが多いので、ループ処理でうっかり the_date を使ってしまっても、確実に投稿日時が表示されるような対策をしておくと安心だと思います。
function.php に以下を書き込みむと、the_dateを使っても確実に投稿日時を表示することが出来ます。
1 2 3 4 5 |
add_action( 'the_post', 'mytheme_the_post' ); function mytheme_the_post() { global $previousday; $previousday = ''; } |
このコードは、オリジナルのthe_date関数をカスタマイズすることになるので、抵抗ある方もいるかも知れませんが、私の環境では、不具合を起こしたことはありません。
(私の環境でうまくいった方法なので自己責任でお願いします!)
上のコードが行っている処理についてご説明すると、
先程、WordPressの裏側で処理されているthe_date関数の内容について翻訳をしましたが、
その内容のなかの、各記事の投稿日時の比較を行う箇所を、無効化する処理を行っています。
この無効化によって、消えてしまった同日記事の投稿日時が、表示されるようになります。
これからWordPressを初めようとされている方に、是非知っておいてもらいたい内容でしたが、
テーマを分業して作成している現場でも、上記のような対応方法でthe_dateの動きを共通化しておくと、
思わぬトラブルを回避できるのではないか思います。