カテゴリ一覧の投稿数を表示＆cssの調整
ブロックウィジェットエディターには投稿数設定が無い？
WordPressの「classic widgets」では、ウィジェットの「投稿数を表示」にチェックをすればカテゴリごとの投稿数をカテゴリタイトルの右側にすぐ表示されるのですが、私が開発したバージョン（6.5.3）では「ブロックウィジェットエディター」が導入され、そこでは投稿数の設定が見つけられません。
外観からウィジェット設定へ
ウィジェットからではなく、「外観」→「カスタマイズ」→「ウィジェット」から設定を変更する必要があります。
カテゴリタイトルを選択するとブロックエディタが出てくるので、オプションから「追加設定を表示」を押下します。
設定から、「投稿数を表示」をアクティブ化することにより、投稿数が表示されるようになりました。
ブロックウィジェットエディターの出力をカスタマイズ
もう少し、カテゴリ名と投稿数の間にスペースが欲しいです。
デフォルトのHTMLの構造を確認
ブロックウィジェットエディターで作成したサイドバーの呼び出しはこのようにしており、
wordpress/wp-content/themes/mytemplate/sidebar.php
<?php if ( is_active_sidebar( 'sidebar' ) ) : ?>
<?php dynamic_sidebar( 'sidebar' ); ?>
<?php endif; ?>生成されるHTMLは以下になります。
<ul class="wp-block-categories-list wp-block-categories">
<li class="cat-item cat-item-12"><a href="…">Google Analytics</a> (1)</li>
…（省略）
</ul>投稿数を で囲むことが出来れば、あとはcssで調整すれば良いですね。
カテゴリーリスト（wp_list_categories()）に出力されるHTMLを正規表現で書き換え
functions.phpにタグで投稿数を囲む処理を追加します。
wordpress/wp-content/themes/mytemplate/functions.php
/**
* 投稿数を <span> で囲み、<a> の中に入れる
*/
function customize_category_list_output($output) {
$output = preg_replace_callback(
'#<a([^>]+)>(.*?)</a>\s*\((\d+)\)#',
function($matches) {
return '<a' . $matches[1] . '>' . $matches[2] . ' <span class="cat-item__count">(' . $matches[3] . ')</span></a>';
},
$output
);
return $output;
}
add_filter('wp_list_categories', 'customize_category_list_output');ページを更新してみると、<span>タグで投稿数が囲まれているのが反映されました。
<ul class="wp-block-categories-list wp-block-categories">
<li class="cat-item cat-item-12"><a href="…">Google Analytics <span class="cat-item__count">(1)</span></a></li>
…（省略）
</ul>あとは、<span>のクラスを使って、スタイルを適用すれば調整できます。
