TwentyTwentyに最終更新日を入れる方法

ども、たきたきでっす。

タイトルの下に作成者やコメント数が表示されているのですが、ここに最終更新日を入れたい!

作成者とかはいらないと思う…

ということで、最終更新日を入れるために色々と調べてみました。

ちなみにこのページはTwentyTwentyの子テーマを作ってそちらをカスタマイズしております

まず、実際に投稿日などの情報を出力している箇所を調べてみると、 /twentytwenty/inc/template-tags.php でやっている模様。 この template-tags.php を子テーマのtwentytwenty_childの方にコピーしてきたら良いのかなと思ったのですが、このファイルは親テーマのfunctions.phpで、

require get_template_directory() . '/inc/template-tags.php';

このようにrequire()で呼び出しているため子テーマ側でtemplate-tags.phpを読み込ませるとエラーとなってしまいます。 むむむ… ということで、別の方法で対応してみました。

まず、/twentytwenty/inc/template-tags.phpを/twentytwenty_child/inc/へコピーして、 ファイル名をmeta.php とします。 次に、meta.phpの以下の部分以外を削除します。

<?php
function twentytwenty_the_post_meta( $post_id = null, $location = 'single-top' ) {

	echo twentytwenty_get_post_meta( $post_id, $location ); //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped in twentytwenty_get_post_meta().

}
(中略)
function twentytwenty_get_post_meta( $post_id = null, $location = 'single-top' ) {

	// Require post ID.
	if ( ! $post_id ) {
		return;
	}
(中略)
}

twentytwenty_the_post_meta と twentytwenty_get_post_meta 以外のfunctionを全て消す感じです。 んで、この2つのfunctionを、twentytwenty_child_the_post_meta、twentytwenty_child_get_post_metaに書き換えて、twentytwenty_child_the_post_metaのメソッド内も以下のように書き換えます。

function twentytwenty_child_the_post_meta( $post_id = null, $location = 'single-top' ) {

	echo twentytwenty_child_get_post_meta( $post_id, $location ); //phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped -- Escaped in twentytwenty_get_post_meta().
}

これで、元のtemplate-tags.phpと違った関数名になりました。

で、twentytwenty_child_get_post_metaの中身を以下のように書き換えます。

// Post date.
if ( in_array( 'post-date', $post_meta, true ) ) {

    $has_meta = true;
    ?>
    <li class="post-date meta-wrapper">
        <span class="meta-icon">
            <span class="screen-reader-text"><?php _e( 'Post date', 'twentytwenty' ); ?></span>
            <?php twentytwenty_the_theme_svg( 'calendar' ); ?>
        </span>
        <span class="meta-text">

            <?php
                $publish_date = get_the_time(get_option('date_format'));
                $update_date = get_the_modified_date(get_option('date_format'));
                if($publish_date == $update_date) { ?>
                <a href="<?php the_permalink(); ?>"><?php echo $publish_date; ?></a>							
            <?php } else { ?>
                <a href="<?php the_permalink(); ?>"><?php echo $publish_date; ?> </a> (最終更新日:<?php echo $update_date; ?>)
            <?php }?>
        </span>
    </li>
    <?php
}

get_the_modified_date()という部分が、最終更新日を取得する関数になります。 引数のget_option(‘date_format’)は、設定ー一般設定内にある日付のフォーマットが反映されます。引数にget_option(‘date_format’)を入れておかないと、設定で指定している日付のフォーマットが無視されてしまいます。

if文が入ってますがこれは更新日と投稿日が同じだった場合は最終更新日の表示をしないようにしています。 ちなみに、未来投稿設定をした場合、おかしな表示なると思いますが未来投稿は基本しなさそうなので放っておこうと思いますw

以上で準備が整いました。 最後にこの twentytwenty_child_the_post_meta() を呼び出す為に、親テーマの/template-parts/entry-header.php を子テーマの方にコピーします(ファイル名はそのまま)

コピーが完了したら、コピーした方を開いて以下の部分を修正します。

// Default to displaying the post meta.
twentytwenty_child_the_post_meta( get_the_ID(), 'single-top' );

もとはtwentytwent_the_post_meta() になっているのですがここを先程作成した twentytwenty_child_the_post_meta に変更すればOKです。

これで…

作者は不要だったので消しちゃいました。 それでも最終更新日がスペースを取るためか2行になっちゃいますね…w

最終更新日が表示されるようになりました!

さらに、コメントが0件の場合は非表示にすると…

// Comments link.
if ( in_array( 'comments', $post_meta, true ) && ! post_password_required() && ( comments_open() || get_comments_number() ) ) {

    $has_meta = true;
    if(get_comments_number() > 0) {
    ?>
    <li class="post-comment-link meta-wrapper">
        <span class="meta-icon">
            <?php twentytwenty_the_theme_svg( 'comment' ); ?>
        </span>
        <span class="meta-text">
            <?php comments_popup_link(); ?>
        </span>
    </li>
    <?php
    }
}
(以下略)

こんな感じでget_comments_number()を使うとコメントの件数が取得できるので0より大きいときだけ表示するようにすればもっとスッキリするかと思います。

参考にしたサイト

https://thewppress.com/basic/how-to-create-a-child-theme/
functions.phpの挙動はこちらが参考になりました。

コメント

タイトルとURLをコピーしました