【自作も可能】WordPressのタグ一覧(タグクラウド)表示
WordPressでタグの一覧(タグクラウド)を表示させる方法をご紹介。
一般的なのはテンプレートタグwp_tag_cloud()を利用する方法ですが、目的のフォーマット(HTML)に成形できない場合には、wp_tag_cloud()を使わずに実装することもできます。
この記事で分かること
- テンプレートタグを使ったタグクラウドの表示方法
- テンプレートタグを使わないタグクラウドの表示方法
豊かに引きこもる。
Webデザインは器。ブログは中身。
「レンちゃんとペンタ」では、2つのスキルを掛け合わせて、
おウチで豊かに楽しく暮らす方法をご紹介しています。
タグクラウドを表示する
WordPressでタグの一覧(タグクラウド)を出力するためのテンプレートタグはwp_tag_cloud()です。
表示させたいテンプレートファイル(sidebar.phpなど)にこのタグを貼り付けるだけで、タグクラウドが表示されます。
フォントサイズのカスタマイズ
デフォルトでタグクラウドを利用した場合、紐づく記事が多いタグほど大きな文字で表示されます。
上記の例だと「CSS」に関する記事が多い一方、「ファビコン」に関しては少なめ、と言う感じです。
フォントサイズを調整したい場合は、以下のパラメーターでカスタマイズします。
パラメーター | 目的 | 値 |
---|---|---|
smallest | 一番小さいタグのフォントサイズ | 数値(単位不要) |
largest | 一番大きいタグのフォントサイズ | 数値(単位不要) |
unit | フォントサイズの単位 | px等(デフォルトはpt) |
フォントサイズを統一したい場合は、smallestとlargestに同じ数値を指定します(あまりスマートなやり方ではありませんが)
フォントサイズの単位は、unitパラメーターで設定する事ができます。
出力されるHTML(フォーマット)のカスタマイズ
wp_tag_cloud()を使うと、デフォルトでは以下のようなHTMLになります。
こうしたHTMLのフォーマットは、formatパラメーターで変更することができます。
パラメーター | 目的 | 値 | format | タグクラウドのフォーマットを設定 | flat / list / arrayのいずれか(デフォルト値はflat) |
---|
listフォーマット
リスト要素として出力されます。
arrayフォーマット
タグの一覧をPHPの配列として返します。HTMLは出力されません。
その他のカスタマイズ
そのほかに以下のパラメーターなどもあります。
・order:タグの並び順を設定
・number:タグの表示件数を設定
・exclude:特定のタグを除外する設定
パラメーターの一覧はWordPressの公式マニュアル(WordPress Codex 日本語版)で見る事ができます。
wp_tag_cloud()を使わずにタグクラウドを表示する
wp_tag_cloud()は便利なのですが、出力されたコードに不要なクラス名やスタイルシートがくっついてきてしまいます。
見た目上は問題ないのですがどうしてもキモチ悪いので、私はwp_tag_cloud()を使わない方法で実装しています。
wp_tag_cloud()でフォーマットをカスタマイズしても気に入ったカタチにできない場合も、この方法が有効です。
参考:get tags – WordPress Codex 日本語版
まとめ
- WordPressでタグ一覧を出力するためのテンプレートタグ:wp_tag_cloud()
- フォントサイズ設定用のパラメーター:smallest / largest / unit
- HTMLフォーマット設定用のパラメーター:format
- get_tags()で直にタグ一覧を取りに行けば、自分の好きなフォーマットで作ることも可能
便利なタグクラウド、好みの形で作成してみてくださいね。