WordPressでブログやWebサイトを運営する際、タグは記事の分類や関連付けに役立ちます。タグ一覧を表示することで、訪問者は興味のあるトピックにすばやくアクセスでき、サイト内回遊率やSEOの向上にもつながります。
表示場所に応じてテーマファイルを選ぶ
タグ一覧を表示するには、まず表示させたい場所を明確にします。以下のように、表示位置によって編集するテーマファイルが異なります。
- サイドバーに表示したい場合：
sidebar.php - フッターに表示したい場合：
footer.php - 固定ページや投稿ページに直接表示したい場合：
page.phpやsingle.php
使用しているテーマやカスタマイズ状況によっては、template-parts/ディレクトリ内のファイルが対象になることもあります。
タグ一覧を表示するコード
編集したいPHPファイルを開き、タグ一覧を表示させたい位置に以下のコードを挿入します。
<?php
$tags = get_tags();
if ($tags) {
echo '<ul class="tag-list">';
foreach ($tags as $tag) {
$tag_link = get_tag_link($tag);
echo '<li><a href="' . esc_url($tag_link) . '">' . esc_html($tag->name) . '</a></li>';
}
echo '</ul>';
}
?>
このコードでは、get_tags()ですべてのタグを取得し、それぞれのタグ名とリンクをリスト形式で出力します。esc_url()とesc_html()を使うことで、セキュリティ面でも安心です。
スタイルのカスタマイズ（任意）
見た目を整えるために、CSSでスタイルを調整することも可能です。たとえば以下のようなCSSを追加することで、シンプルで見やすいタグリストになります。
.tag-list {
list-style: none;
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.tag-list li {
background: #f0f0f0;
padding: 4px 10px;
border-radius: 4px;
}
.tag-list a {
text-decoration: none;
color: #333;
}
style.cssに追記するか、テーマカスタマイザーの「追加CSS」に記述してください。
表示確認と動作テスト
ファイルの編集後は保存し、ブラウザでサイトを開いて表示が反映されているか確認します。必要であればキャッシュのクリアも行いましょう。
まとめ
WordPressでタグ一覧を表示することで、ユーザビリティとSEOの両面で効果が期待できます。テーマファイルにコードを追加するだけの簡単な実装なので、ぜひ活用してみてください。表示デザインにもこだわることで、サイト全体の印象をさらに高めることができます。
