カテゴリーやタグのタームの区切り文字「、」を表示しないカスタマイズ

2021年9月16日(木)2023年5月8日(月) 対馬俊彦

対馬俊彦

こんにちは、魚沼情報サービスの対馬です。

WordPress ではカテゴリーやタグのターム（ひとつひとつの項目）が「、」で区切って表示されていることがよくあります。

その「、」を消したいと思うことがあります。

例えば以下のタグのように、アイコンをつけている場合は「、」が不要ですので、表示しない方がすっきりしますよね。

ここはフィルターフックで「、」を一括で消してしまいたいところですが、それだけでは完全な解決にならないことに気がつきました。

このように ↓ 表示されている部分もあるんです。

記事の後に表示されているカテゴリー（「Lightning」と「カスタマイズ」）の区切りの「、」はあった方がいいのですが、「前の記事」のところに表示されているタグ（「カバーブロック」と「動画」）の区切りの「、」はない方がいいですね。

そこで、以下の考え方でカスタマイズしてみました。

フィルターフックを使って「、」を一括で消してしまう。ただし、カスタム投稿タイプには影響がないようにする。※
記事の後のカテゴリーにもアイコンをつける。

※このサイトでは、カスタム投稿タイプで「賃貸物件」を作ってあるので、賃貸物件の表示はそのまま手を加えないようにします。

カスタマイズした結果、こうなりました。👍

上記のカスタマイズのやり方を紹介します。

このカスタマイズをする前の時点で、このサイトではすでにかなりカスタマイズを行ってあるので、ご覧いただいている方の参考にならない部分があるかもしれませんが...

手順① functions.php

functions.php に以下のフィルターフックを追加します。

// カテゴリーやタグのタームの区切りの「、」を表示しない (標準の投稿のみ)
function my_change_separators( $separators ) {
  if ( 'post' === get_post_type() ) {
    $separators[ 'between' ] = '';
    $separators[ 'between_last_two' ] = '';
    $separators[ 'between_only_two' ] = '';
  } else {
    $separators[ 'between' ] = '、';
    $separators[ 'between_last_two' ] = '、';
    $separators[ 'between_only_two' ] = '、';
  }
  return $separators;
}
add_filter( 'wp_sprintf_l', 'my_change_separators' );

手順② CSS

以下の CSS を追加します。

body.blog .vk_post_taxonomy_terms a,
body.post-type-post .vk_post_taxonomy_terms a {
margin-right: .8em;
}

body.blog .entry-meta-data-list dd:not(.tagcloud) a:before,
body.post-type-post .entry-meta-data-list dd:not(.tagcloud) a:before {
font-family: "Font Awesome 5 Free";
content: "\f07c";
font-weight: bold;
margin-right: .4em;
}

参考にしたページ

以下のページを参考にさせていただきました。

おまけ区切り文字の設定が3つもある理由

英語の場合、区切り文字が以下のようになります。

そのため、英語表記のサイトではフィルターフックの該当部分を以下のように書くのだと思います。

$separators[ 'between' ] = ', ';
$separators[ 'between_last_two' ] = ', and ';
$separators[ 'between_only_two' ] = ' and ';

日本語の場合は3つとも読点「、」を使うので、↓ こうしてあります。

$separators[ 'between' ] = '、';
$separators[ 'between_last_two' ] = '、';
$separators[ 'between_only_two' ] = '、';

投稿者プロフィール

対馬俊彦魚沼情報サービス (新潟県南魚沼市)

WordPress を使用したサイト制作・カスタマイズを全国どこからでも承ります。ベクトルが販売している WordPress テーマ「Lightning」「Katawara」および同社のプラグイン「VK Blocks」「VK Filter Search」のカスタマイズを得意としています。遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを開設・運用する上で、うまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

このサイトで行っているカスタマイズのやり方の多くもマンツーマンのオンラインレッスン形式などでわかりやすく説明させていただくことができますので、興味がある方はご連絡ください。

* ドメインやサーバーの契約・申込み
* WordPress やテーマ、プラグインのインストール
* アクションフック・フィルターフック・jQuery・CSS によるカスタマイズ
* ドメインの移管・移転
* 日常の更新作業
なども含めて、サイトの制作・運用全般をお手伝いできます。

また、制作業者様のサイト制作のお手伝いも数多く行っております。いま人手が足りない、ちょっとここだけコーディングを頼みたい、等々… お仕事の依頼をお待ちしています。

ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。

» ご相談・お問い合わせはこちらからどうぞ

WordPress / Lightning オンラインサポートのご案内

サイトをご覧いただき、ありがとうございます。このサイトを運営している、魚沼情報サービスの対馬です。

WordPress を使用したサイト制作・カスタマイズ・サポートを全国どこからでも承っています。ベクトルが開発している WordPress テーマ「Lightning」「Katawara」および同社のプラグイン (VK Blocks Pro ・ VK Filter Search Pro) を使ったサイト制作・カスタマイズを最も得意としています。遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを開設・運用する上で、うまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

* ドメインやサーバーの契約・申込み
* WordPress やテーマ、プラグインのインストール
* アクションフック・フィルターフック・jQuery・CSS によるカスタマイズ
* ドメインの移管・移転
* 日常の更新作業
なども含めて、サイトの制作・運用全般をお手伝いできます。

* 近くに頼りになるところがない
* わからないところを教えてほしい
* 専門家にサイト制作を手伝ってもらいたい
という方はぜひお気軽にご相談ください。

ご要望をうかがった上で費用見積り（無料）を提示させていただきます。

ご相談・お問い合わせはお気軽にどうぞ