[_s] content.php

content.php

_sのcontent.phpは、archive.php、index.php、search.phpからget_template_partで読み込まれるテンプレートパートファイルで、content部分の最も基本的なファイルです。

<?php
/**
 * Template part for displaying posts
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
 *
 * @package _s
 */

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
	<header class="entry-header">
		<?php
		if ( is_singular() ) :
			the_title( '<h1 class="entry-title">', '</h1>' );
		else :
			the_title( '<h2 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
		endif;

		if ( 'post' === get_post_type() ) :
			?>
			<div class="entry-meta">
				<?php
				_s_posted_on();
				_s_posted_by();
				?>
			</div><!-- .entry-meta -->
		<?php endif; ?>
	</header><!-- .entry-header -->

	<?php _s_post_thumbnail(); ?>

	<div class="entry-content">
		<?php
		the_content( sprintf(
			wp_kses(
				/* translators: %s: Name of current post. Only visible to screen readers */
				__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', '_s' ),
				array(
					'span' => array(
						'class' => array(),
					),
				)
			),
			get_the_title()
		) );

		wp_link_pages( array(
			'before' => '<div class="page-links">' . esc_html__( 'Pages:', '_s' ),
			'after'  => '</div>',
		) );
		?>
	</div><!-- .entry-content -->

	<footer class="entry-footer">
		<?php _s_entry_footer(); ?>
	</footer><!-- .entry-footer -->
</article><!-- #post-<?php the_ID(); ?> -->

the_ID()とpost_class()

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

個別の記事を囲むIDとclassを生成します。個別記事をID/classで分けることができるようになるので単純に便利です。_sだけでなく他の多くのテーマでも同じように使われているようなので、WordPressの標準的な書き方のルールと理解するのが良いようです。

WordPress Codex Function Reference/post class

How to Style Each WordPress Post Differently そのぞれの投稿をどのように装飾するか

the_ID()

WordPress Codex テンプレートタグ/the ID

post_class()

WordPress Codex テンプレートタグ/post class

is_singular()

if ( is_singular() ) :
			the_title( '<h1 class="entry-title">', '</h1>' );
		else :
			the_title( '<h2 class="entry-title"><a href="' . esc_url( get_permalink() ) . '" rel="bookmark">', '</a></h2>' );
		endif;

is_singular() は、is_single() 、is_page()、is_attachment() のどれかがTrueの時に、Trueを返します。個別の投稿記事を読み込んだ場合など、タイトルにリンクが必要ないので、そういった時のために分岐できるようにしています。

WordPress Codex 関数リファレンス/is singular

_s_ から始まる関数

if ( 'post' === get_post_type() ) :
			?>
			<div class="entry-meta">
				<?php
				_s_posted_on();
				_s_posted_by();
				?>
			</div><!-- .entry-meta -->
		<?php endif; ?>
	</header><!-- .entry-header -->

	<?php _s_post_thumbnail(); ?>

_s_posted_on()、_s_posted_by()、_s_post_thumbnail()は、inc\template-tags.php に定義され、適切なhtml要素を出力します。

the_content()p_kses()

the_content( sprintf(
			wp_kses(
				/* translators: %s: Name of current post. Only visible to screen readers */
				__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', '_s' ),
				array(
					'span' => array(
						'class' => array(),
					),
				)
			),
			get_the_title()
		) );

一見わかりにくいですが、the_content()で投稿内容を表示して、the_contentに引数をとることで、screen-reader の使用者に対しては、「Continue reading タイトル」という内容を伝えて、先を読むかどうかの確認をすることができるようにしています。

the_content()

WordPress Codex テンプレートタグ/the content

class=”screen-reader-text”

screen-readerとは、視覚に障害がある人を対象に、内容を読んで操作を促すデバイスです。”screen-reader-text”クラスは、アクセサビリティのため使われていて、 screen-readerにしか見えないようにテキストを装飾します。

The CSS class screen-reader-text

__()

翻訳を取得するための関数です。

WordPress Codex 関数リファレンス/__

wp_kses()

ksesとは ‘kses Strips Evil Scripts.”「keseは悪いスクリプトを取り除きます」の略だそうで、特定のHTMLタグや属性のみを許可したい場合に使います。第一引数の文章に対して、第二引数のHTMLタグ以外を全て取り除きます。今使われている部分では「Continue reading<span class=”screen-reader-text”>タイトル</span>」というhtmlを出力します。

WordPress Codex Function Reference/wp kses

wp_link_pages()

wp_link_pages( array(
			'before' => '<div class="page-links">' . esc_html__( 'Pages:', '_s' ),
			'after'  => '</div>',
		) );

wp_link_pages()は、ページネーション機能(投稿を複数のページへ分割する機能)を使うための関数だそうです。投稿の編集画面で、<!–nextpage–>と書くと、改ページされるそうです。

WordPress Codex ページネーション

WordPress Codex テンプレートタグ/wp link pages