WordPressで投稿ページの抜粋を表示する方法

WordPressの編集画面から、手動で抜粋を設定して表示する方法の備忘録です。
設定した抜粋のテキストは、トップページの投稿一覧などに抜粋文として表示できます。
抜粋の設定
はじめに、WordPressの管理画面から抜粋に表示するテキストを設定します。
投稿ページの編集画面「投稿」オプションにある「抜粋を追加」をクリックします。

抜粋が表示されていない場合
投稿に「抜粋を追加」が表示されていない場合は、右上の「オプション」から「設定」開き追加します。

一般のインターフェース内にある「抜粋」をオンにすると使用できるようになります。

抜粋を記入する
「抜粋を追加」をクリックすると入力用のフィールドが表示されるので、テキストを入力して投稿を保存します。

投稿ページに抜粋が設定できました。

抜粋文を変更したい場合は、「抜粋を編集」から編集できます。
抜粋を表示する
続いて、テンプレートファイルに抜粋を表示するためのコードを追記します。
<?php the_excerpt(); ?>
投稿記事一覧のループの中など、コードを設定した箇所にthe_excerpt()
を記入することで<p>
タグに囲まれた抜粋文を表示できます。
以下は、トップページの投稿記事一覧に抜粋を追加したコードのサンプルです。
<?php
$args = array(
'post_type' => 'post',
'posts_per_page'=> 3,
'paged' => 1
);
$query = new WP_Query($args);
?>
<?php if ($query->have_posts()) : while ($query->have_posts()) : $query->the_post(); ?>
<div class="article-item">
<div class="title"><?php the_title(); ?></div>
<?php the_excerpt(); ?>
</div>
<?php endwhile; endif; wp_reset_postdata(); ?>
投稿のタイトルの下に「抜粋」のテキストを表示しています。

抜粋が設定されていない場合は、記事の冒頭が抜粋文として表示されます。
抜粋する文字数を制限する
抜粋で表示するテキストの文字数を制限したい場合は、wp_trim_words()
を使用して設定します。
<p><?php echo wp_trim_words( get_the_excerpt(), 30 ); ?></p>
get_the_excerpt()
で取得した抜粋の文字列を、第2引数に設定した文字数に変更して出力します。サンプルコードでは、「30」文字に制限されます。

省略された抜粋文の末尾には「…」という文字列が自動で追加されます。
抜粋の末尾を変更する
抜粋の制限した文字数の末尾に表示するテキストを「…」から変更したい場合は、wp_trim_words()
に引数を追加します。
<p><?php echo wp_trim_words( get_the_excerpt(), 30, '… MORE' ); ?></p>
第3引数に設定した文字が末尾に追加されます。

抜粋文の末尾に「… MORE」が追加されました。
末尾にリンクを追加する
抜粋の末尾にその投稿記事へのリンクを追加したい場合は、wp_trim_words()
の引数に設定します。
<p><?php echo wp_trim_words( get_the_excerpt(), 30, '… <a href="' . esc_url( get_permalink() ) . '">' . 'MORE' . '</a>' ); ?></p>
第3引数にesc_url( get_permalink() )
で投稿記事のURLを取得して、リンクのコードを追加しています。

「MORE」部分をクリックすると投稿記事のページへ遷移します。