wordpressでtime要素を使って投稿日や更新日を表示する方法

WordPressで記事の投稿日や更新日などを取得してtime要素で表示していましたが、バリデーションを行うとdatetime属性のフォーマットが異なっている旨のエラーが出ていたので正しいtime要素の使い方を覚え書きします。

(adsbygoogle = window.adsbygoogle || []).push({});

投稿日と更新日の取得方法

投稿日を取得するにはいくつかの関数がありますがthe_time()を使用し、更新日はthe_modified_time()を使用しました。

//投稿日を取得
<?php the_time('Y-m-d'); ?>
//更新日を取得
<?php the_modified_time('Y-m-d'); ?>

投稿日、更新日どちらともパラメーターを'Y-m-d'としているので「YYYY-MM-DD」の形で出力されます。パラメーターを変更することで様々なフォーマットで出力することができます。詳しくは日付と時刻の書式 - WordPress Codex 日本語版で確認してみましょう。

time要素を使って投稿日と更新日を表示する

早速time要素を使用し投稿日を表示しましょう。今回はdatetime属性も併せて入力して見ました。datetimeについてはtime 要素 - HTML | MDNで確認できますが日付を入力する時は「YYYY-MM-DD」の形で入力する必要があります。

今回はdatetime属性の値を「YYYY-MM-DD」、実際の表示は「YYYY/MM/DD」としたい時のコードになります。

投稿日を表示するコード

//投稿日
<time datetime="<?php the_time('Y-m-d'); ?>"><?php the_time('Y/m/d'); ?></time>

更新日を表示するコード

//更新日
<time datetime="<?php the_modified_time('Y-m-d'); ?>"><?php the_modified_time('Y/m/d'); ?></time>

一行で済むので特に苦戦することなく表示されるかと思います。コードを書く際はループ文の中にコードを書きましょう。

以前書いていたコード&エラー

記載する必要がないかもしれませんが、バリデーションを行う前に書いていた以前のコードとエラーがこちら。

<time datetime="<?php the_time('Y/m/d'); ?>" class="post_time"><?php the_time('Y-m-d'); ?></time>

Markup Validation Serviceで下記のエラーが出ました。

Bad value yyyy/mm/dd for attribute datetime on element time: The literal did not satisfy the time-datetime format.Markup Validation Service

datetime属性のフォーマットが「yyyy/mm/dd」となっていた為エラーが出ていました。正しいdatetime属性のフォーマットは「yyyy-mm-dd」でした。またtime要素のpubdate属性は廃止されておりこちらも文法違反でエラーが出るので注意が必要です。

シェアする

コメント

おすすめの関連記事