HOME
Blog
TwentyTwentyで公開日と更新日を表示
カテゴリー
Blog

TwentyTwentyで公開日と更新日を表示

公開日:2020年8月29日
最終更新日:2020年10月13日

今使っているTwentyTwentyというテーマでは、デフォルトで投稿者名と公開日が入ります。しかし、同時にアンカーテキストも入ってしまうんですよね。何とかアンカーテキストなしで公開日と更新日を表示出来ないものか…。

  • はじめに
  • 追加CSSで投稿者、公開日を非表示
  • 子テーマのfunctionsにコードを設定
  • 公開日と更新日をタイトル下に表示
  • 終わりに

はじめに

デフォルトで表示される投稿者名と公開日。このまま使ってもよかったのですが、アンカーテキスト(ハイパーリンク)が付いています。ハイパーリンクが多いのは良くないと聞いたので、何とか消したい。

しかし、色々調べてみても消し方が分かりませんでした。Chromでは利用できるがIEでは利用できない、など条件付きの消し方はあったのですが、ごちゃごちゃするのは面倒です。

そこで、デフォルトのものを非表示にし、新しく公開日と更新日が画面に表示されるようにしました。

追加CSSで投稿者、公開日を非表示

これはすぐに出来ました。追加CSSでmeta-textを非表示にすれば消えてくれます。

.meta-text{display:none}

子テーマのfunctionsにコードを設定

続いて、子テーマのfunctionsに下のコードを入れました。私のような初心者のために、一応説明を入れておきます。

  • get_the_date
    • 公開日
  • get_the_modified_date
    • 最終更新日
  • echo
    • 出力するコードのようです
  • font-size
    • 1.7remは何となくで決めました。自由に変えていいと思います。
<?php
function koushin(){
$str.='公開日:'.get_the_date().'<br/>'.'最終更新日:'.get_the_modified_date();
echo '<p style="font-size:1.7rem;">'.$str.'</p>';
}
?>

公開日と更新日をタイトル下に表示

後は、いつも使っているAdInserterに下のコードを入れます。場所はBefore contentにすればタイトル下に表示されます。

ただし、デフォルトのとは違いアイキャッチの下に表示されてしまうんですよね。本当はアイキャッチの上に表示されてほしいのですが。妥協しました。

<?php koushin(); ?>

終わりに

何とかデフォルトの公開日を非表示にし、アンカーテキストが無い状態で公開日、さらに最終更新日を表示することに成功しました。

残念ながらアイキャッチの下に表示されてしまいますが、仕方ありません。機能は果たせますしね。

皆さんも参考にして下さい。