【OOPS!】最終更新日を投稿記事内に表示する方法

この記事は、「OOPS!」で最終更新日を投稿記事内に表示する方法について掲載しています。「OOPS!」以外のテーマでは、操作が異なる場合がありますのでご注意下さい。
 

スポンサーリンク

更新日を記事内に表示する

 

関連記事

投稿記事が更新されるとWordPress内部では最終更新日が記録されています。それは内容に影響のない誤字等の軽微な修正を行った場合でも上書きされて記録されます。 この記事では、「最終更新日」に任意の日付を指定可能にし、記事内容の更新に[…]

eyecatch_wordpress
 

上記の記事で「最終更新日」を任意の日付で設定する方法を紹介しました。しかし、そのままでは記事に更新日は表示されません。「OOPS!」で投稿記事に表示させる場合、最終更新日を配置するためのコードをpage-header.phpに記述する必要があります。
 

「OOPS!」は、ヘッダー画像の上に重ねて公開日が表示される仕様のため、日付表示をしている位置が一般的なテーマとは異なります。「OOPS!」以外のテーマではこの記事で掲載している方法とは操作が異なる場合がありますのでご注意下さい。

投稿記事を生成しているPHPファイルはテーマによって異なる場合があります。一般的なテーマの投稿記事の場合は「single.php」になりますが、テーマによってはPHPファイルが細分化されている場合もありますので、「OOPS!」以外のテーマで修正を行う場合は、投稿記事の更新日に該当する部分のPHPファイルを確認する必要が出る場合があります。

 

タグは「the_time」になりますので、ファイル内を検索して該当箇所を探してください。

<time>
公開日:<?php the_time('Y/m/d');?><br>
</time>

該当タグを見つけたら、下のように3行目~5行目のコードを追記して下さい。

<time>
公開日:<?php the_time('Y/m/d');?><br>
<?php if(get_the_time('Y/m/d') != get_the_modified_date('Y/m/d')):?>
最終更新日:<?php the_modified_date('Y/m/d') ?>
<?php endif;?>
</time>

 

このコードを使用すると、公開日と最終更新日が同日になった場合は公開日のみの表示になります。「if(get_the_time(‘Y/m/d’) != get_the_modified_date(‘Y/m/d’))」の部分で「公開日と最終更新日が異なる場合」を判定し、条件に合致した時のみ最終更新日が表示されるようになっています。
 

公開日と更新日の比較は分単位までチェックします。
【通常更新】を選択していると、同じ日付でも更新する度に更新日に日付が上書きされていきます。
誤って更新日を登録してしまった場合は、記事の編集画面で【更新方法】の【更新日時消去(公開日時と同じにする)】を選択して更新して下さい。

 

コードを入力して記事をプレビューで確認すると、公開日の隣に最終更新日が表示されているのを確認出来ます。

 

  • 日付の前にあるアイコンはFontAwesomeを使用しています。日付を示すPHPコードの前にアイコンタグを挿入すると表示出来ます。

 
 
FontAwesomeの使い方については、以下のサイトを参考にして下さい。

Font Awesome5 の基本的な使い方 | Web Design Leaves

 

以前はFontAwesomeをCDN+CSS+Webフォントの組み合わせで利用する場合にアカウントを登録する必要はありませんでしたが、Ver.5.9以降はアカウントを登録をしてログインしないとタグ等の確認が出来なくなっています。
この記事の掲載時点ではCDN使用時の<link>タグの内容にアカウントごとの違いはありませんでした。

Ver.5.9に関する詳細については以下のサイトを参考にして下さい。

Font Awesome 5.9を利用する方法 | EBISUCOM

 
FontAwesomeの公式サイトは下のリンクになります。

Font Awesome 公式サイト

 
 

Webフォントを使用するとページが重くなるのでは?と心配している方へ
 

個別のページごとに<head>タグへのコードの挿入やCSS編集を可能とする方法を下のリンクにある【カスログ】で解説しています。

この方法を行えば、必要のないページでCSSファイル等が読み込まれてしまうといった問題が回避可能です。

当サイトでも使用しており大変重宝しています。

※PHPファイルの編集を行いますので導入にはご注意下さい。
※「OOPS!」には個別ページ用カスタムCSSは実装されています。