【Snow Monkey】関連記事部分のスタイルを変更するカスタマイズ

Snow Monkeyテーマのカスタマイズ記事です。

現在のSnow Monkey(5.6.0)では、記事一覧レイアウトが関連記事にも反映される為、記事一覧はシンプルにして、関連記事一覧はリッチメディアの記事一覧レイアウトに個別に変更したいと言う場合は、カスタマイズが必要となっています。そのためのカスタマイズテクニックをご紹介。

my-snow-monkeyで出来る方法です(5.6.1で確認)

定番のお約束!フックを仕掛ける

フックを仕掛けないと始まりません。仕掛けます。

add_filter(
	'snow_monkey_get_template_part_template-parts/content/related-posts',
	'_related_posts',
	10,
	2
);

今回のフックは、関連記事のテンプレートを取得する際に処理を行うフックを使用!

フックしたfunctionの中身を書きます

例えば、関連記事の部分だけの記事一覧レイアウトをリッチメディアにしたい場合は下記となります。(説明は後述)

public function _related_posts( $_name, $_vars ) {
	$_is_removed = remove_filter(
		'snow_monkey_get_template_part_template-parts/content/related-posts',
		'_related_posts',
		10
	);
	if ( $_is_removed ) {
		add_filter(
			'theme_mod_' . get_post_type() . '-entries-layout',
			'_entries_layout',
			10,
			1
		);

		ob_start();
		\Framework\Helper::get_template_part( 'template-parts/content/related-posts', $_name, $_vars );
		$_html = ob_get_clean();
		$_html = mb_ereg_replace(
			'<ul class="c-entries c-entries--[^"]*">',
			'<ul class="c-entries c-entries--rich-media">',
			$_html
		);
		echo $_html;

		remove_filter(
			'theme_mod_' . get_post_type() . '-entries-layout',
			'_entries_layout',
			10
		);
	}
}

public function _entries_layout( $_value ) {
	return 'rich-media';
}

こうなると思われます。

entries-layoutをaddとremoveしている理由

template-parts/content/related-posts.php内では、$layoutに記事一覧レイアウトを取得しています。その際、元のレイアウトを取得される為、変更した後のレイアウトと差異が出ます。
強制的に変更をしたいレイアウトのリッチメディアとして判定をさせる為に、このようにentries-layoutフックを使用して切り替えています。

上記のフックで判定を変更しているのに、<ul>を更に変えている理由は?

オリジナルの記事一覧レイアウトを追加した場合や、記事一覧レイアウトの他のカスタマイズをした際のフックの優先度に対する問題で、そのままでは<ul>のクラスが元のシンプルで記述されてしまう場合がある時もあります。
そうした場合は置換しておけば対策されます。それが理由です。

リッチメディア以外のレイアウトにする

rich-mediaと記述している2箇所を、シンプルならsimple、テキストならtextと変更すれば出来ます。

この記事を書いた人

kmix-39

kmix-39

主に日本の関西に出没する。
小学時代にWindows 95に触れ、BASICを始めて以来、HTML、Perl、Java(JSP, Servlet)、COBOL、C++、C#、PHP、Objective-C、Swift…と、数々の言語を地獄の現場を経験しながら覚えていった元IT社畜。
「好きな時に 好きなことを 好きなだけ」をしたい。