[WordPress] Twenty Seventeenテーマで全体文の代わりに要約を表示する

Last Updated: 2023 年 08 月 30 日 8のコメント

WordPress 4.7バージョンでは、2017年度の基本テーマであるTwenty Seventeenが追加されました。 このテーマは、以前のデフォルトのテーマとは異なり、ヘッダに画像や動画を置くことができようにし、より動的なサイト構築が可能となりました。

Twenty Seventeenテーマで全体文の代わりに要約を表示する方法

フロントページに最新の記事を表示する場合(設定>読むから」最新記事「設定)記事リストに要約文が表示されるのではなく、文全体が表示されます。もちろん個々の記事ごとに」もっと見るタグ「を追加して要約を表示することができますが、これは面倒なことではありません。

この場合、 / WP-コンテンツ/themes/twentyseventeen/template-parts/post/ 下の content.php ファイルの次の部分を検索するようにします。

(この作業をする前に必ずチャイルドテーマを作って作業してください。」ワンクリックで簡単にチャイルドテーマを作成する記事を参考にしてください。そして、このためにはFTPにアクセスする必要があります。FTPの使い方は この記事を参照してみてください。 )

"%s" '、'twentyseventeen')、get_the_title())); wp_link_pages( array( 'before' => ' '。 __( 'Pages:', 'twentyseventeen' ), 'after' => ' ', 'link_before' => ' ', 'link_after' => ' ', )); ?>

上記の部分を以下のように修正するようにします。 (※2023年8月更新:下記の「アップデート:コード改善」のコードをご使用ください。)

"%s" '、'twentyseventeen')、get_the_title())); wp_link_pages( array( 'before' => ' '。 __( 'Pages:', 'twentyseventeen' ), 'after' => ' ', 'link_before' => ' ', 'link_after' => ' ', )); else : the_excerpt( sprintf( __( 'Continue reading "%s" ', 'twentyseventeen' ), get_the_title() ) ); wp_link_pages( array( 'before' => ' '。 __( 'Pages:', 'twentyseventeen' ), 'after' => ' ', 'link_before' => ' ', 'link_after' => ' ', )); endif; ?>

保存し、サイトを再読み込みしてみると以下の図のように要約が表示されます。

Twenty Seventeenテーマで全体文の代わりに要約を表示する方法

お北! サムネイルまで表示されますね。 サムネイルが表示されない場合は、個々の投稿について特性の画像「を設定してください。参照)。 以上の簡単なプロセスを介して最新記事の一覧に全体文の代わりに要約を表示することができます。 要約の長さを調整する方法は、このブログで検索してみて見つけることができます。

アップデート:コードの改善

コードを改善し、コメントを追加しました。

<div class="entry-content">
  <?php
    // Check if the current view is a single post view
    // 현재 뷰가 단일 포스트 뷰인지 확인
    if ( is_single() ) :

      // Display the full content of the post and add a "Continue reading" label for screen readers
      // 포스트의 전체 내용을 표시하고 스크린 리더용 "계속 읽기" 레이블을 추가
      the_content( sprintf(
        __( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentyseventeen' ),
        get_the_title()
      ));

      // If the post content is divided into multiple pages, display the page links
      // 포스트 내용이 여러 페이지로 나뉘어 있다면 페이지 링크를 표시
      wp_link_pages( array(
        'before'      => '<div class="page-links">' . __( 'Pages:', 'twentyseventeen' ),
        'after'       => '</div>',
        'link_before' => '<span class="page-number">',
        'link_after'  => '</span>',
      ));

    else :

      // If it's not a single post, display the post excerpt
      // 싱글 포스트가 아닌 경우 포스트 요약글 표시
      the_excerpt( sprintf(
        __( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentyseventeen' ),
        get_the_title()
      ));

      // If the excerpt content is divided into multiple pages, display the page links
      // 요약글 내용이 여러 페이지로 나뉘어 있는 경우 페이지 링크 표시 (사용되지 않을 가능성이 큼)
      wp_link_pages( array(
        'before'      => '<div class="page-links">' . __( 'Pages:', 'twentyseventeen' ),
        'after'       => '</div>',
        'link_before' => '<span class="page-number">',
        'link_after'  => '</span>',
      ));

    endif;
  ?>
</div><!-- .entry-content -->

メモ:


8のコメント

コメント

  1. 助けていきます。
    コード中にwp_link_pages()の呼び出し部分は重複なのでif-else構文外(下)を差し引いてもなりそうですね。
    ありがとうございます。

    応答
  2. ありがとうございます! このため、数日間頭をソクヒョトた! しくしくありがとうございます!

    応答
  3. あ特性画像の設定をしてくれるなんてサムネイルが見えますね^^;

    ところが特性画像を設定すると、その画像がタイトル上端部にも大きく
    露出がさㅜㅜスレッドに非常に大きなサイズの画像が...見えないようにする方法はないでしょうか?

    応答
    • こんにちは?

      Customizerを見てみると別にFeatured Imageを制御するオプションはないですね。

      この場合、CSSを使用して取り除くか、直接ソースを変更する必要があります。

      次のCSSコードを追加してください。
      .single-featured-image-header,
      .home .post-thumbnail {
      display: none;
      }

      チャイルドテーマを作成した場合チャイルドテーマのフォルダ内のstyle.cssに追加して、テストしてみてください?

      応答
      • 説明をとてもよくていただき、チャイルドテーマは、プラグインを作ってよく設置しました^^

        そしてチャイルドテーマにCSSコードを貼り付けていた
        メイン画面のサムネイルまで行こうかよ〜
        私は本文の特性イメージだけ見えないようにしたかったんですよ!

        だから教えてくれたCSSコードで
        .home .post-thumnail。 部分だけを削除して使用したところ、
        メイン画面では、サムネイルが表示され、
        本文では、属性画像が隠れてました〜

        何も知らずに開始する WordPressので心配が多くなって
        難しい部分も多かったが、サイトを通じて多くの助けられています
        ありがとうございます! ^^

  4. お知らせいただいたようによく使用しました!
    ところが、私はサムネイルが表示されないのに。どのように設定してくれるとサムネイルまで見ることができますか?

    応答
    • こんにちは?

      不思議このコメントは、目立たない返事が遅れました。
      上記の文を更新しました。

      PSああ…上に別々にコメントしましたね。 朝から私は精神がないですね。

      応答