お問い合わせ

SWELLカスタマイズ|カテゴリーの代わりにカスタムタクソノミーのラベルを表示するには?

SWELLはカスタム投稿タイプに対しては関連するカスタムタクソノミーのタームをヘッダ部分に表示してくれます。

ただし、カスタムタクソノミーが複数割り当てられている場合は、1つのカスタムタクソノミーしか表示してくれません。

正直、カスタムタクソノミーを自前で導入しているようなケースでは、複数のカスタムタクソノミーを使っていることが多いため、あまり役に立たない機能と言えます。

SWELLは細かくテンプレートファイルが分かれていますので、テンプレートファイルを子テーマで書き換えることでカスタマイズできます。

正直、SWELLで少し気が利いたことをすると、子テーマによるカスタマイズが必要になる構造になっていますので、子テーマは必須だと思います。

SWELLフォーラムにあった事例

タクソノミーをカテゴリーのように表示したいという質問?がありました。

回答が付いていまして、自前でタームリストを用意して、actionフックで出力すればよいよね?という回答です。

insertBeforeメソッドというキーワードがいきなり出てきますがおそらくjavascriptのinsertBeforeメソッドのことだと思います。

僕ならswell_before_post_thumbフックを使います。

投稿日・公開日を表示する仕様かつ投稿日・公開日の左側にタームを表示したい場合は、insertBeforeメソッドで.p-articleMetas__times要素の前にターム情報(.c-categoryList)を指定すれば投稿ページと同じデザインに仕上がります。

https://users.swell-theme.com/forum/postid/229/

SWELLはその後、タームを表示できるようになったのですが、対応しているタクソノミーは1つだけとなっており、複数のタクソノミーに対応できないか?という要望もありました。

カスタム投稿の投稿ページに、自動で1つまでタクソノミーのタームリンクが表示されますが、
複数のタクソノミーを設定した時に、設定したタクソノミーすべてのタームリンクが表示されると嬉しいです。
ご検討をよろしくお願いいたします。

https://users.swell-theme.com/forum/swell-request/%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0%E6%8A%95%E7%A8%BF%E3%81%AE%E6%8A%95%E7%A8%BF%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AB%E8%A4%87%E6%95%B0%E3%82%BF%E3%82%AF%E3%82%BD%E3%83%8E%E3%83%9F%E3%83%BC%E3%81%AE/

これは無理スジな要望だとおもいます。カスタムタクソノミーやそのタームはいくらでも設定できてしまうのでテーマ側で対応するのは難しいでしょう。

カスタマイズのインターフェースを用意するぐらいしかテーマでは対応できないと思います。

SWELLでカスタムタクソノミーを表示するテンプレートパーツ

SWELLには、投稿のヘッダー部分でカテゴリやタグなどを表示する個所にカスタムタクソノミーのタームを表示するテンプレートパーツがあります。

parts/single/item/term_list.phpがテンプレートパーツになります。

このファイルを子テーマにコピーして書き換えれば、カスタマイズができます。

SWELLカスタマイズの内容

SWELLはカスタム投稿のみカスタムタクソノミーのタームを表示するようになっています。

投稿の場合はカスタムタクソノミーが使われていても表示されません。

// カスタム投稿用
$has_tax = false;
//if ( 'post' !== $the_type ) {
	$show_tax = isset( $variable['show_tax'] ) ? $variable['show_tax'] : true;
//	$tax_slug = $show_tax ? SWELL_Theme::get_tax_of_post_type( $the_type ) : '';
	$tax_slug = 'taxonomy_slug'; // 表示したいタクソノミーのslugを指定
	$tax_data = $tax_slug ? SWELL_Theme::get_the_terms_data( $the_id, $tax_slug ) : null;
//}

?>

投稿タイプの判定部分をコメントアウトすれば、タクソノミーを表示できるようになります。

ただし、SWELL_Theme::get_tax_of_post_type( $the_type )の部分が投稿の場合はcategoryが返ってきてしまうので、タクソノミーが表示されません。

$tax_slugを表示したいカスタムタクソノミーのslugに変更すれば、表示されるようになります。

SWELLで複数のタクソノミーに対応するには?

タクソノミーを自動的に取得するというのは聞いたことがありません。

タクソノミーは自分で設定しているので、出力したいタクソノミーの数だけ、SWELLの処理内容を繰り返せばいいだけですね。

フックを仕込んでおけば、いろんなケースで使いまわしがききます。

parts/single/item/term_list.phpを見ると、$tax_slugが一つだけになっていますから、そこをタクソノミーslugの配列にして外部からfilterフックで書き換えられるようにします。

ターム出力部分をタクソノミーslugの配列の要素に対して、foreachで回すように変更しておきます。

そうすれば、functions.phpとかでタクソノミーslugの配列を上書きすれば、かなり汎用的なテーマになりそうな気がします。

<?php
if ( ! defined( 'ABSPATH' ) ) exit;

$the_id   = get_the_ID();
$the_type = get_post_type();
$show_cat = $variable['show_cat'] ?? true;
$show_tag = $variable['show_tag'] ?? true;
$cat_data = $show_cat ? SWELL_Theme::get_the_terms_data( $the_id, 'category' ) : null;
$tag_data = $show_tag ? SWELL_Theme::get_the_terms_data( $the_id, 'post_tag' ) : null;

// カスタム投稿用
$has_tax = false;
$tax_slugs = array();
//if ( 'post' !== $the_type ) {
	$show_tax = isset( $variable['show_tax'] ) ? $variable['show_tax'] : true;
	$tax_slug = $show_tax ? SWELL_Theme::get_tax_of_post_type( $the_type ) : '';
    $tax_sulgs[] = $tax_slug;
    $tax_slugs = apply_filters('swell__taxonomy_list',$tax_slugs);
	//$tax_data = $tax_slug ? SWELL_Theme::get_the_terms_data( $the_id, $tax_slug ) : null;
//}

?>
<?php if ( ! empty( $cat_data ) ) : ?>
	<div class="p-articleMetas__termList c-categoryList">
		<?php foreach ( $cat_data as $data ) : ?>
			<a class="c-categoryList__link hov-flash-up" href="<?=esc_url( $data['url'] )?>" data-cat-id="<?=esc_attr( $data['id'] )?>">
				<?=esc_html( $data['name'] )?>
			</a>
		<?php endforeach; ?>
	</div>
<?php endif; ?>
<?php if ( ! empty( $tag_data ) ) : ?>
	<div class="p-articleMetas__termList c-tagList">
		<?php foreach ( $tag_data as $data ) : ?>
			<a class="c-tagList__link hov-flash-up" href="<?=esc_url( $data['url'] )?>" data-tag-id="<?=esc_attr( $data['id'] )?>">
				<?=esc_html( $data['name'] )?>
			</a>
		<?php endforeach; ?>
	</div>
<?php endif; ?>

<?php foreach ( $tax_slugs as $tax_slug ) : 
$tax_data = $tax_slug ? SWELL_Theme::get_the_terms_data( $the_id, $tax_slug ) : null;
?>
<?php if ( ! empty( $tax_data ) ) : ?>
	<div class="p-articleMetas__termList c-taxList">
		<?php foreach ( $tax_data as $data ) : ?>
			<a class="c-taxList__link hov-flash-up" href="<?php echo esc_url( $data['url'] ); ?>" data-term-id="<?php echo esc_attr( $data['id'] ); ?>">
				<?php echo esc_html( $data['name'] ); ?>
			</a>
		<?php endforeach; ?>
	</div>
<?php endif; ?>
<?php endforeach; ?>
<?php
add_filter('swell__taxonomy_list',function(){
	return array('circle');
});

SWELL作者がテーマ側で複数タクソノミーに対応する可能性は?

おそらく対応はされないと思います。

SWELLはブログテーマという位置づけで、Wordpressの標準的な機能しかサポートしない方針のようです。

同一作者のArkheは、Woocommerceにも対応しているので、タクソノミー周りは強化されていると思います。

まとめ:SWELLでカスタムタクソノミーのラベルを表示する

カスタム投稿やカスタムタクソノミーを導入する場合は、SWELLはカスタマイズ無しではどうにもなりません。

テーマを編集するとテーマのアップデートの時に差分確認が必要になりますので、なるべくカスタマイズするファイルの種類を減らして、ファイルの編集個所をわかりやすくしておく方が良いでしょう。

他の人にもシェアしてね
コメントを閉じる

コメント

コメントする

コメントは日本語で入力してください。(スパム対策)

クリックできる目次