WordPress

WordPressの抜粋を表示させるthe_excerpt()の使い方やそのカスタマイズなど色々

WordPressのテンプレートタグにthe_excerpt()というのがあります。これを使用すればトップページに記事の抜粋を表示させることができます。the_content()でもmoreタグを本文中に入れるとそこまでの文字が出力できるのですが、毎回moreタグ入れるのがめんどくさい(たまに入れ忘れたり)という人はthe_excerpt()を使った方が作業が楽になるかと思います。

the_excerpt()の使い方

まずは抜粋を正しく動作させるために日本語版WordPressに最初から同梱されてあるプラグイン「WP Multibyte Patch」を有効化します。これを有効にすると、何も設定していなければ110文字までの抜粋文字が表示されます。これをトップページに表示させるにはindex.phpのループ内で使用します。

<?php the_excerpt(); ?>

これで記事の先頭から110文字の抜粋が表示されます。

自分で抜粋文字を作りたい場合

自分で抜粋に入れる本文を作りたい場合もあるかと思います。その場合は管理画面の投稿の抜粋欄に自分が抜粋させたい文字を打ち込むとそれが表示されます。

抜粋欄

もし抜粋欄が表示されてなかったら管理画面上部にある「表示オプション」をクリックして「抜粋」にチェックを入れてみてください。

抜粋をカスタマイズしてみる

the_excerpt()で抜粋を表示させると色々とカスタマイズをしたくなるかと思います。なのでいくつか気になりそうな部分を変更してみます。

抜粋の長さ(文字数)を変更

WP Multibyte Patchを有効化した場合、標準で出力される文字数は110文字です。この文字数を変更したい場合は以下のコードをfunctions.phpに追加します。

function new_excerpt_mblength($length) {
     return 100;
}
add_filter('excerpt_mblength', 'new_excerpt_mblength');

この場合は100文字が表示されます。

抜粋の終端に表示される、[…]を変更

抜粋の最後には[…]というのが表示されるのですがこれを変更したい場合は以下のコードをfunctions.phpに追加します。

function new_excerpt_more($more) {
     return '...';
}
add_filter('excerpt_more', 'new_excerpt_more');

この場合は […] が … に変更されます。

抜粋に「続きを読む」リンクを追加したい

続きを読むためのリンクなんかを表示させたい場合には以下のコードをfunctions.phpに追加します。

function new_excerpt_more($post) {
     return '<a href="'. get_permalink($post->ID) . '">' . '続きを読む' . '</a>';
}
add_filter('excerpt_more', 'new_excerpt_more');

ここでちょっと個人的に気になったことがあるんですが、上記の「続きを読む」リンクを追加した場合、投稿の抜粋欄に何も入力しなかった時はリンクを出力できるのですが、抜粋欄に好きな抜粋を入力した場合はリンクを出力されませんでした。そこで抜粋欄に文字を入力した場合でもリンクを出力するようにしてみます。ここでは抜粋欄に文字が入っている場合はその文字とリンクを表示して、抜粋欄に何も入力されてない場合には記事本文を先頭から設定した文字数を抜粋として表示させます。

<?php
     if( has_excerpt() ){
          the_excerpt();
          echo '<a href="';
          the_permalink();
          echo '">続きを読む</a>';
     } else {
          the_excerpt();
     }
?>

has_excerpt()というのがありますが、これは抜粋欄に抜粋が入っている場合にはtrue、何も入ってない場合にはfalseを返します。これにより抜粋が入っている場合はリンクを追加してあげます。has_excerpt()って結構便利ですね。これを使えば抜粋がある場合は抜粋を表示して、それ以外はthe_content()で全文を表示させるなど色々と自分に合った出力ができるかと思います。
ちなみにthe_excerpt()、has_excerpt()のソースファイルは/wp-includes/post-template.php内にあります。

JavaScriptの基本構文を忘れた!って時にサクっと見たい10項目前のページ

テーマにWordPressのウィジェットを対応させ検索フォームをカスタマイズする次のページ

関連記事

  1. WordPressのログイン時のツールバー

    WordPress

    WordPressでthe_author()を使えば記事に簡単に投稿者名を表示させることができる

    WordPressで記事を書いた投稿者名を表示させたい時ってあるかと思…

  2. Hemingway

    WordPress

    レスポンシブ対応の2カラムWordPressテーマ「Hemingway」

    レスポンシブに対応した2カラムのお洒落なWordPressテーマを発見…

  3. WordPressにPocketボタンを設置

    WordPress

    WordPressにPocketボタンを設置するやり方

    そういえばPocketのボタンをまだ設置していなかったので、このたび設…

  4. WordPress

    WordPressのContact Form 7にCAPTCHAを導入するためのプラグイン「Real…

    WordPressのお問い合わせフォーム(Contact Form 7…

  5. WordPress

    WordPressでカスタムフィールドを使って任意のコードやファイルをhead内に読み込ませる

    以前「WordPressで特定の記事やページにカスタムフィールドで指定…

  6. WordPressのログイン時のツールバー

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. エチオピア
  2. 紗々 飴色和栗
  3. DCG-CA21
  4. Apple WatchでのMacロック解除を無効
  5. オータムスイートポテトフラペチーノ

アーカイブ

PAGE TOP