2022/02/24

WordPress自作テーマで記事のタイトルと本文の文字数を調整する

こんにちはふるぽんです。
今回は、wordpressサイトなどでTOPページに投稿記事の一部を表示する事が多いと思うのですが、記事のタイトルと本文の長さによってはスタイルが崩れる時があります。
いや、崩れたんです笑
そんな時に表示する文字数を調整する方法です。

タイトルと本文の文字数を措定

mb_substrというPHPの関数を使う方法もあるのですが、HTMLタグが出力される場合があるので、
wp_trim_wordsを使っていきます。
パラメーターは以下の通りです。
echo wp_trim_words( $text, $num_words, $more );

プラグインのWP Multibyte Patchの有効化を推奨します。
マルチバイトの問題でうまく表示されない場合があります。

タイトルの場合は以下です。
20文字に制限しています。簡単です。下のケースは最後は空白で設定しているので特に何も表示されません。

<h3><?php echo wp_trim_words( get_the_title(), 20, ' ' ); ?></h3>

本文の場合は以下です。40文字に制限です。

<?php echo wp_trim_words( get_the_content(), 40); ?>

なお本文はトップページなどで一部を表示する際、the_excerpt();を使う方も多いと思います。
the_excerpt();の文字数の調整の仕方も解説しておきます。
以下のコードをfunctions.phpに記載します。

function new_excerpt_mblength($length){

  return 80;　//80文字に制限

}

add_filter('excerpt_mblength','new_excerpt_mblength');

表示する時はget_the_excerpt()をechoしていきます。

<p><?php echo get_the_excerpt();?></p>

デフォルトでは末尾に・・・がついてきます。下のコードはその・・・を消すためのコードです。
同じくfunctions.phpに記載します。

function new_excerpt_more($more) {

  return ' ';

}

add_filter('excerpt_more', 'new_excerpt_more');

なお’ ‘に「続きを読む」などを返せばそれが表示されます。
以上が記事タイトルと本文の文字数を調整する方法でした。
わからないことがあれば、DM頂けましたら僕にできることはお手伝い&助言いたします。
こちらは40代の僕が独学で学習してきたことです。
何を勉強しようか迷ったら参考までにどうぞ