Twenty Fifteenのトップページを抜粋一覧表示にカスタマイズ

　WordPress4.1日本語版のアップデートが来たので、さっそく公式テーマのtwenty fifttenにしてみました。

　やはり最初に気になったのはトップページやアーカイブのページに記事全文がずらずら並んでいるというのは見にくいので、抜粋表示にカスタマイズしました。twenty fourteenからずいぶん変わっていて、twenty fourteenのやり方は通用しませんが、サイト内検索の結果が抜粋表示されるという部分をそのままトップページでも利用しようという、いかに楽してカスタマイズできるかという方針から探っていたらできました。

子テーマにindex.phpとcontent.php、archive.phpをコピー

　テーマを変更したので、子テーマも新たにtwentyfifteen用に作成した前提です。twentyfifteenのテーマフォルダから、index.phpとarchive.php、content.phpを子テーマにコピーします。

content.phpをリネームして編集

　content.phpを、content-○○○.phpにリネームします。

　そしてcontent-top.phpを編集します。29行目から53行目を変更します。

	<div class="entry-content">
		<?php
			/* translators: %s: Name of current post */
			the_content( sprintf(
				__( 'Continue reading %s', 'twentyfifteen' ),
				the_title( '<span class="screen-reader-text">', '</span>', false )
			) );

			wp_link_pages( array(
				'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
				'after'       => '</div>',
				'link_before' => '<span>',
				'link_after'  => '</span>',
				'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
				'separator'   => '<span class="screen-reader-text">, </span>',
			) );
		?>
	</div><!-- .entry-content -->

	<?php
		// Author bio.
		if ( is_single() && get_the_author_meta( 'description' ) ) :
			get_template_part( 'author-bio' );
		endif;
	?>

	<div class="entry-content">
         <?php the_excerpt(); ?>
	</div><!-- .entry-content -->

　29-53行目を上記の3行に書き換えます。

index.phpとarchive.phpを編集

　index.phpは39行目を変更します。archive.phpファイルは42行目を変更します。どちらもcontent-○○○.phpの「-○○○」部分を付け加えるだけです。

 get_template_part( 'content', get_post_format() );

 get_template_part( 'content-top', get_post_format() );

表示確認

　トップページを開いてみます。

　なかなかいい感じになりました。抜粋の最後も、「続きを読む」に最初からなっています。アーカイブやカテゴリーでの表示も同じようになっていればOKです。

最後にひとこと

　content.phpの変更は、サイト内検索用のcontent-serch.phpの中身を参考に変更しています。あとは、index.phpの変更したところの上に書いてある注釈を読んでのカスタマイズでした。

(2017/07/29追記）プラグインで簡単に抜粋表示にすることもできます。

デフよん

 

4 Pockets

プラグインEasy Custom Auto ExcerptでWordPressトップページを抜粋表示に

https://def-4.com/easy-custom-auto-excerpt

​