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

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

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 サイトにしたいなら G3 Pro Unit がおすすめ

Lightning G3 Pro Pack
ベクトルから発売されている有料プラグイン Lightning G3 Pro Unit を使えば、このサイトで紹介しているようなコードを書かずにかんたんにカスタマイズできることがたくさんあります。

名前に Pro がついているので「制作のプロ向け製品」という印象を受けるかもしれませんが、
*もっといいサイトにしたい
* 効率よく作成・運用・管理をしたい
と考えているコーポレートサイトの作成担当者にこそ使っていただく価値がある製品です。

Lightning G3 Pro Unit は Lightning G3 Pro Pack というパッケージで VK Blocks Pro とセットで販売されています(単体販売はされていません)。このパッケージを使うと、便利なカスタマイズ機能やリッチなコンテンツ制作に役立つブロックをたくさん利用できるようになりますので、効率的にサイトを制作・運用したい方はぜひこのパッケージをお使いになることをおすすめします。