メインコンテンツに移動
ホーム

古松

メインナビゲーション

  • ホーム
  • ビデオ
  • ご連絡

パンくず

  • ホーム
  • WordPressの関数(the_excerpt())より投稿の抜粋表示および抜粋/ティーザー(Teaser)の概念

WordPressの関数(the_excerpt())より投稿の抜粋表示および抜粋/ティーザー(Teaser)の概念

WordPressの投稿に「抜粋」入力エリアがあります

  • WordPressの投稿に「抜粋」の入力エリアがあります
  • 投稿編集画面に「表示オプション」をクリックすれば、隠されたオプションに「抜粋」項目があります
    WordPressの投稿編集画面に「抜粋」オプションを選択
  • 「抜粋」は、投稿の本文を纏め、略文のようなもので、短く本文を説明するような存在

WordPressの初期環境では「抜粋」が表示されない

  • 「抜粋」が投稿編集画面で簡単に追加できますが、初期環境では投稿一覧/詳細画面に表示されないです

「抜粋」の表示はテンプレートに「the_excerpt()」関数の追加が必要

  • テーマ:twentyseventeenでは、wp-content/themes/twentyseventeen/template-parts/postにあるテンプレート:content.phpの編集が必要
  • content.phpの58行あたり、以下のようにthe_excerpt()関数を挿入します
    if( is_single() ){
    	// single: 投稿の詳細ページに指している
    	the_content( sprintf(
    		__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentyseventeen' ),
    		get_the_title()
    	) );
    } else {
    	// singleではない: 投稿の一覧ページに指している
    	the_excerpt(); // 抜粋の表示
    }
  • テーマによって、the_content()がテンプレート(大体はsingle.php, content.phpなど)にあります
    • 前後関係を見て、投稿の一覧/詳細ページを見分ける必要があります
    • 詳細ページに抜粋の表示必要はありません

抜粋表示ルール1:マニュアル抜粋がそのままに表示される

  • マニュアル抜粋:投稿編集画面で「抜粋」が入力された場合(例:投稿4)に指しています
  • マニュアル抜粋は入力された「抜粋」のままで投稿一覧に表示されます
    • 「続き読む」(詳細へのリンク)はありません

抜粋表示ルール2:自動抜粋が投稿内容の最初から110文字が抜粋として表示される

  • 自動抜粋:マニュアル抜粋がない場合、システムが投稿内容の最初から110文字を抜き出して、抜粋とします
    • 投稿内容が110文字未満の場合、投稿内容のすべて抜粋になります
  • 110文字が初期設定で、自動抜粋の文字数をfunction.phpで設定できます
    /**
     * 例:20文字で抜粋を制限.
     *
     * @param int $length Excerpt length.
     * @return int (Maybe) modified excerpt length.
     */
    function wpdocs_custom_excerpt_length( $length ) {
        return 20;
    }
    add_filter( 'excerpt_length', 'wpdocs_custom_excerpt_length', 999 );
  • 初期環境で文字数をカウントするときに英数字の基準なので、マルティバイト(日本語など)では正しく文字数がカウントされないことがあります。
    • プラグイン: WP Multibyte Patch をインストール、有効化にして日本語の文字数を正しくカウントします
  • 「続き読む」(詳細へのリンク)は抜粋の後ろに表示されます

ティーザー(Teaser): 抜粋表示+続きを読む(詳細へのリンク)

  • ティーザーという概念は抜粋表示の形に指しています
  • マニュアル抜粋表示はティーザー(Teaser)ではありません。なぜかというと「続きを読む」リンクがないからです
  • 自動抜粋表示はティーザー(Teaser)となります

検索フォーム

カテゴリ別

  • laravel
  • drupal
  • javascript
  • windows
  • html
  • mysql
  • php
  • apache
  • css
  • SEO
  • video
  • wordpress
  • linux
  • python
  • Electron
  • Visual Studio Code

google ads