the_tags() - 投稿のタグ情報を表示させる | KoMariCote

the_tags()

投稿記事に設定しているタグを、リンク付きで全て表示する。

更新2024/04/29

投稿に付いているタグを表示させたい時に使えるのが、the_tags() というWordPressのテンプレートタグです。投稿した記事ページや、記事一覧ページの1つ1つの投稿にタグを表示させたい場合に使えます。

使い方

【構文】

the_tags( $before = 'null', $sep= ',', $after = '' )
the_tags('タグリストの前に付く文字', 'タグとタグの間の文字', 'タグリストの後ろに付く文字');

【返り値】エラーがあればfalse。正常であれば何も返さない。

ループ内が利用可能範囲で、ループの外で記述しても何も表示されません

パラメーター

パラメータはタグリストの前後、タグとタグの間の文字を指定します。

  • $before (string)オプション

    タグリストの最初に使用する文字列。

    【初期値】 タグ:(日本語の場合。英語の場合はTags:)

  • $sep (string)オプション

    タグとタグの間に使用する文字列。

    【初期値】 , (コンマ)

  • $after (string)オプション

    タグリストの最後に使用する文字列。

    【初期値】 なし

詳細・注意事項

the_tags() は、投稿についているタグの情報を取得してリンク付きで出力します。

デフォルトのままで問題なければ、パラメーターを指定せずとも下記のように記述するだけで、その投稿に設定されているタグを表示してくれます。

<?php the_tags(); ?>

この表記の場合、「タグ: 」と言う表記の後にリンクつきでタグ名が表示されます。

投稿ページでタグを表示
カテゴリー一覧ページでタグを表示

HTMLでは以下のように出力されます。(タグ01とタグ02が投稿に設定されていた場合)

タグ: <a href="tagのarchiveページへのURL" rel="tag">タグ01</a>, <a href="tagのarchiveページへのURL" rel="tag">タグ2</a>

投稿にタグがついていなければ表示されない

1つもタグを設定しない場合は、このコードを記述しても表示されません。

上記の画像のように、背景の色だけ表示されて中身が表示されないということもあるので、スタイルの当て方に気をつけたり条件分岐をつけるなどしてタグがない記事もあり得る場合に備えておきましょう。

パラメーターをつけて出力内容を変更する使用例

デフォルトとは違った形で出力させたい場合は、引数に条件を指定する必要があります。

パラメーターは必ずしも3つ付ける必要はなく、前につく文字だけ変更したい場合は1つでもOK。ただし、タグの間の文字や後ろに付く文字だけを変更したい場合は、その前のパラメーターの記述が必要です。

「タグ: 」テキストだけを変更する

デフォルトではタグのリストの前に「タグ: 」というテキストが表示されるので、このテキストだけを変更したい場合は、以下のようにします。

<?php the_tags('キーワード: '); ?>
<!-- 以下のコードと同様の結果になる。 -->
<?php the_tags('キーワード: ', ', ', ''); ?>

【表示例】
キーワード: タグ01, タグ02

文字をなくしたい場合は「”」という形で空欄にします。

<?php the_tags(''); ?>

【表示例】
タグ01, タグ02

タグとタグの間をカンマ(, )から変更する

<!-- タグ間の文字列を変更 -->
<?php the_tags('', '・', ''); ?>

【表示例】
タグ01・タグ02

リスト表示にする

HTMLタグをパラメータに指定することで、出力をリスト表示にできます。

<?php the_tags( '<ul><li>', '</li><li>', '</li></ul>' ); ?>

このように記述することで下記のようにHTMLが出力されます

<ul>
  <li><a href="//example.com/tag/tag01/" rel="tag">タグ01</a></li>
  <li><a href="//example.com/tag/tag02/" rel="tag">タグ02</a></li>
</ul>

【表示例】
・タグ01
・タグ02

HTMLの class などを書く際の注意

クラスも追加できますが、クォーテーションの使い方だけ注意が必要です。
シングルクォーテーションを外側に使用したら、その内側はダブルクォーテーションにします。逆でも良く、囲む部分によって変更することが重要です。

<?php the_tags( '<ul class="tag_list"><li>', '</li><li>', '</li></ul>' ); ?>

リンクなしの場合は別のテンプレートタグを使う

リンクなしで取得したい場合やタグに関する他の情報も取得したい、カスタマイズして出力したい、といった場合は get_the_tags()get_tags() を使用します。

公式コードファイルとドキュメントはこちら

wp-includes/category-template.php

the_tags() - WordPress.org

コード Reference 一覧へ

TOPへ