気になったことはなんでも調べてメモするブログ
  1. WordPress
  2. 12 view

WordPressテーマを自作しよう(5)日付や時刻のフォーマットを操る

Last updated: 2020/03/24

前回の記事で、記事の内容が表示できるようになりました。

 
とりあえず表示した! だけなので、いろいろと調整したいですよね。
今回は投稿した日付・時刻を自在に操る方法について書きます。

テーマがフォーマットを指定しない場合、ユーザーがフォーマットを変えることができる

前回書いたコードでは、「投稿した日」と「投稿した時間」を別の関数で取得していました。

  <article class="contents-list">
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    (投稿日時:<?php echo get_the_date(); ?>) <?php the_time(); ?>)<br/>
    <?php the_content(); ?>
  </article>

結果、私の環境では get_the_date で「3月 21, 2020」、the_time で「2:02 AM」と出力されていたんですが、別のフォーマットで日時が表示された方もいると思います。
それは、二つの関数で特にフォーマットを指定しなかった場合(つまりカッコ内に何も書かなかった場合)、ダッシュボードの設定で指定されたフォーマットが適用される仕様だからです。使っているコードが同じでも、設定が異なれば表示されるテキストも異なるのです。

ここの設定を変えれば、日付のフォーマットを任意のものに変えることができます。
「このテーマ自分しか使わないし、ここで変えれるなら楽だわ!」なんて思った方がいるかもしれませんね。
でもそうする前に、少し考えてみてください。

サイト(ブログ)で表示する日時のフォーマット、全部同じでいいんですか?

例えば、記事一覧では「January」って表示するけど別のところでは「1月」って出したいなんてことは、ユーザー設定に任せると実現できません。場所によってフォーマットを切り替えることができないからです。
自作テーマを不特定多数に配布することを目標としているなら尚更、ユーザー設定にフォーマットを委ねるのは危険が伴います。「このテーマを使うなら設定でこういう風にしてね」を果たして守ってもらえるでしょうか?

私は、日付のフォーマットも含めてテーマ作成者がデザインすべきだと考えます。
次の項目でやり方をご説明します。

the_time にフォーマットを指定しよう

例として、「xxxx年x月x日 xx:xx」と表示されるようにしてみます。

  <article class="contents-list">
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    <?php the_time('(投稿日時: Y年n月j日 H:i)'); ?><br/>
    <?php the_content(); ?>
  </article>

the_time は何も指定しなければ投稿された「時刻」しか出力しませんが、実は指定次第でなんでも表示することができます。なので日付も the_time に任せてしまえば、コードを簡略化することができるでしょう。

フォーマットを指定する際に使える英字は、次の表にまとめました。

英字 表示例
4桁 Y 2020
下2桁 y 20
2桁の数字 m 01
数字 n 1
フルスペル文字(※) F January
簡略文字(※) M Jan
2桁の数字 d 01
数字 j 1
曜日 フルスペル文字(※) l Monday
簡略文字(※) D Mon
午前/午後 小文字 a am
大文字 A AM
時間 12時間単位の数字2桁 h 00〜11
12時間単位の数字 g 0〜11
24時間単位の数字2桁 H 00〜23
24時間単位の数字 G 0〜23
2桁の数字 i 00
2桁の数字 s 00

※ダッシュボードで設定した言語によって、表示されるテキストが異なる場合があります。表示例は英語です。

なぜ the_date ではなく get_the_date を使ったか?

サンプルで元々使っていた get_the_date の仕様に触れておこうと思います。

基本的にWordPressが用意している関数で「get_」が頭につくものは、それだけでは文字の出力を行いません。出力するには echo を合わせて使用する必要があります。

//どちらも日付を出力する処理
the_date();
echo get_the_date();

「the_dateの方を使った方が文字数が少なくてシンプルでいいじゃん」って感じがしますよね。書く量が少ないのはいいことです。現に、the_time の時は get_the_time を使っていませんしね。
しかし the_date と get_the_date に関してだけは、出力するかしないかだけではない、大きな違いがあるのです。

the_date は、同じ日に投稿された記事の日付を最初しか出力してくれません。
the_date を使って日付を表示しようとした場合、例えば1月1日に投稿された記事が2つ以上あった場合、2つ目以降の日付の部分に何も表示されなくなってしまうのです。全ての記事に投稿日を表示したい場合、これでは困りますね。
そんな時に、get_the_date を使用するのです。

では the_date は全く必要ないかというと、そうとは言い切れません。
結局のところ「どのように表示したいか」によるのです。
同じ日に投稿された記事をまとめて表示したい時は、the_date なら非常に楽に書くことができます。

  <?php the_date('Y年n月j日に投稿した記事', '<strong>', '</strong>', true); ?>
  <article class="contents-list">
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
    (投稿日時:<?php echo get_the_date(); ?>) <?php the_time(); ?>)<br/>
    <?php the_content(); ?>
  </article>

the_date と get_the_date、どちらを使用するかは、デザイン次第なのです。
(上のタグの使い方はあんまりよくないです……手っ取り早く strong 使っちゃいましたがそれより p とかで囲むべきですね)

次回は記事の更新日を表示してみます。

まとめ

自作テーマを配布する気がなくても、日時のフォーマットはテーマ側で指定した方がレイアウトが崩れません。
公式資料で書式を確認しましょう。

the_time("任意のフォーマット");

the_date はループ内ですでに同じ日に投稿された記事がある場合、日付を出力してくれません。状況に応じて get_the_date や the_time(get_the_time) と使い分けましょう。




WordPressの最近記事

  1. WordPressテーマを自作しよう(6)更新日時を表示する

  2. WordPressテーマを自作しよう(5)日付や時刻のフォーマットを操る

  3. WordPressテーマを自作しよう(4)記事一覧を表示する

  4. WordPressテーマを自作しよう(3)スタイルシートを読み込む

  5. WordPressテーマを自作しよう(2)サイト名を表示してリンクを貼る

関連記事

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP