get_previous_post_link()とget_next_post_link()のページャーにアイキャッチ画像を追加する

毎度おなじみの小ネタ。

抱えている案件で、単一投稿ページに設置したget_previous_post_link()とget_next_post_link()のページャーにアイキャッチ画像を付けてくれ!と要請があった。

 

まぁほぼほぼ置換だけで済むので、さっくりと対応してみた。

 

で、今回のコードは表題通り、get_previous_post_link()とget_next_post_link()を使う。

previous_post_link()とnext_previous_post_link()の方ではない。(こいつらが内部的に読んでるのも、結局は件の2個だけど。)

next_post_link()とprevious_post_link()だとテンプレートでの呼び出しは非常に便利だが、ちょっと小細工しようとすると不便だし、別の投稿タイプとかでまま使いたいときに不都合なので対象外。

 

それを踏まえて、書いたコードはこんな感じ。

// previous
function theme_previous_post_link(){
	$pager = get_previous_post_link();

	$post_id  = '';
	$image_id = '';
	$alt      = '';
	$thumb    = null;

	if ( $pager ) {
		$pager = get_previous_post_link( '%link' ); // ここであらかじめget_previous_post_link()の引数を指定しておく
		$post_id = url_to_postid(
			preg_replace( '~^.+?href="(.+?)".+?$~', '\1', $pager )
		);
		if ( has_post_thumbnail( $post_id ) ) {
			$image_id = get_post_thumbnail_id( $post_id );
			$alt      = get_post_meta( $image_id, '_wp_attachment_image_alt', true );
			$thumb    = wp_get_attachment_image_src( $image_id );

			if( isset( $thumb[0] ) )
				$thumb = <img src="' . esc_url( $thumb[0] ) . '" alt="' . esc_html( $alt ) . '" />;
		}
		$pager = preg_replace( '~(<a.+?>)~', '\1' . $thumb, $pager );
	}

	echo $pager;
	//return $pager;
}

// next
function theme_next_post_link(){
	$pager = get_next_post_link();

	$post_id  = '';
	$image_id = '';
	$alt      = '';
	$thumb    = null;

	if ( $pager ) {
		$pager = get_next_post_link( '%link' ); // ここであらかじめget_next_post_link()の引数を指定しておく
		$post_id = url_to_postid(
			preg_replace( '~^.+?href="(.+?)".+?$~', '\1', $pager )
		);
		if ( has_post_thumbnail( $post_id ) ) {
			$image_id = get_post_thumbnail_id( $post_id );
			$alt      = get_post_meta( $image_id, '_wp_attachment_image_alt', true );
			$thumb    = wp_get_attachment_image_src( $image_id );

			if( isset( $thumb[0] ) )
				$thumb = <img src="' . esc_url( $thumb[0] ) . '" alt="' . esc_html( $alt ) . '" />;
		}
		$pager = preg_replace( '~(<a.+?>)~', '\1' . $thumb, $pager );
	}

	echo $pager;
	//return $pager;
}

 

テンプレート側にはtheme_previous_post_link()とtheme_next_post_link()で呼び出すことで、表題のページャーの設置ができる。

サンプルコードらしく簡潔に記述してあるので、必要に応じてもう少しいじってもいいかも。

(実際に導入用に作ったコードはもうちょっと置換条件が多かったり変数などを使いまわしていたりする。)

 

 

「どうやってやったの?プラグインで?」と、たまにいつもやり取りしているヒトから言われるときがあるが、こういった小ネタ的な部分はプラグインを使わずともfunctions.phpに直接設置して対応したいもの。

 

自分だけが使うテーマならいいけど、ワンオフのテーマにあれやこれやと細かいところまでプラグインを入れてしまうと、導入時にプラグイン入れるのと設定するのとで時間を使ってしまう、プラグインの入れ忘れが発生する・・・とかとかあるし(´・ω・`)

カテゴリ

この記事のコメント

コメントはないです。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です