やわらかしかっけい

なんでもすぐに忘れてしまう自分のために

SWELLでタグクラウドを特定のページに挿入する(投稿数順・投稿数カウントあり)

タグクラウドは、SWELLではなくワードプレスの機能である。

ブロックエディタで手軽に挿入できるし、
下記のphpコードでも呼び出せる。

<?php wp_tag_cloud(); ?>

デフォルトのタグの並びはアルファベット順だが、
これを投稿数が多い順・少ない順に並び替えるようなオプションも用意されている。
ただし、この順番並び替えオプションはphpで記述する必要がある。
(参考: WordPressでタグクラウドを設置する方法|tamatuf

これをSWELLで使うにはどうしたらよいか。

前提:
子テーマを使うこと(functions.phpなどのテーマファイルをいじるため)

失敗:子テーマのfunctions.php にコードを書くも、効かず

【SWELL】タグクラウドを使用の多い順に20表示にカスタマイズする | h-tktr blog

上記ページを参考に、コードを子テーマのfunctions.phpに書いてみたが、反映されなかった。
アプデ等の事情で、上記コードが使えなくなっている可能性がある。
(フィルターフック「widget_tag_cloud_args」が効いてないのかも。未検証)

そのため、ChatGPTに相談しつつ、下記のようなコードで解決した。

例1:固定ページ「hoge」のタイトル下にタグクラウドを挿入する

  • 子テーマのfunctions.php に下記コードを追加
function insert_tag_cloud_at_content_start($content) {
    // 挿入するタグクラウドのHTMLを生成
    $tag_cloud = '<div class="tag-cloud">' . wp_tag_cloud(array(
        'orderby' => 'count', // 使用頻度順に並べる
        'order'   => 'DESC',  // 降順
        'show_count' => true, //投稿数表示あり
        'echo'    => false    // HTMLを返す(出力しない)
    )) . '</div>';

    // タグクラウドを `the_content` の内容の先頭に追加
    return $tag_cloud . $content;
}

// hogeページで適用
function apply_tag_cloud_to_hoge_page($content) {
    if (is_page('hoge')) {
        return insert_tag_cloud_at_content_start($content);
    }
    return $content;
}
add_filter('the_content', 'apply_tag_cloud_to_hoge_page');

(このやり方じゃなくて普通に子テーマのpage.phpにif文で書けば良いと後から気づいたけど、まぁこれでも動きました)

例2:固定ページ「hoge」のサイドバーにタグクラウドを挿入する

  • 親テーマ(SWELL)の sidebar.phpを子テーマにコピー。
  • 子テーマのsidebar.php</aside> 直前に下記コードを挿入。
<?php if ( is_page('hoge') ): ?>
	<div class="tag-cloud"><?php wp_tag_cloud(array(
	        'orderby' => 'count', // 使用頻度順に並べる
	        'order'   => 'DESC',  // 降順
	        'show_count' => true //投稿数表示あり
	    )) ?></div>
<?php endif; ?>

例3:カテゴリー、タグなどのアーカイブページのタイトル下にタグクラウドを挿入する

  • 親テーマ(SWELL)の archive-term.phpを子テーマにコピー。(archive.phpじゃないので注意)
  • 子テーマのarchive-term.php <div class="p-termContent l-parent"> の上か下に下記を挿入。
<div class="tag-cloud"><?php wp_tag_cloud(array(
'orderby' => 'count', // 使用頻度順に並べる
'order'   => 'DESC',  // 降順
'show_count' => true //投稿数表示あり
)) ?>
</div>

番外編:SWELLの機能を使う

SWELLのフォーラムを漁ってみたところ、開発者の方が、
タグクラウドの代わりに SWELL機能の「リンクリストブロック」の使用を薦めているのを見た。

リンクリストブロックであれば、

  • タグへのリンクを一括生成できる
  • 並び替えもできる
  • タグクラウド型のスタイルにもできる

とのこと。

確かに、手動での並び替えでOKなのであれば、
ブログパーツでリンクリストブロックを作り、
それを使いたいところに挿入するのでも良さそう。

しかし、WordPress純正のタグクラウドと違って下記のような欠点がある。

  • タグが増えても自動で反映されない。手動で追加する必要あり
  • 投稿数の表示はできない

そのため、今回はSWELLのリンクリストブロックは使わずに、
子テーマのファイルにコードを書き込む方法をとった。