ワードプレスのget_the_tag_list関数の使用方法・解説

概要

get_the_tag_list 関数は、投稿記事の投稿タグを列挙した文字列を取得する際に利用されます。この関数は、投稿に関連付けられたタグをリスト形式で表示するために用いられ、特に以下のような場面で有効です。

  1. 投稿詳細ページにタグを表示する際
  2. サイドバーやフッターにあるウィジェットでタグを表示する際
  3. タグクラウドのカスタマイズ
  4. SEO最適化のためにタグを表示する際
  5. カスタムテンプレートでのタグリスト表示
  6. 投稿のメタデータとしてタグを表示する際
  7. タグに基づくフィルタリングの実装
  8. モバイルフレンドリーなデザインでのタグ表示

構文

get_the_tag_list( $before, $sep, $after, $id );

パラメータ

  • $before (文字列、オプション) : 各タグの前に付ける文字列。デフォルトは空。
  • $sep (文字列、オプション) : 各タグの間に挿入する文字列。デフォルトはカンマとスペース (“, “)。
  • $after (文字列、オプション) : 各タグの後に付ける文字列。デフォルトは空。
  • $id (整数、オプション) : 投稿の ID。指定しない場合は現在の投稿が使用される。

戻り値

  • タグを列挙した文字列。タグが無い場合は空文字列を返します。

関連する関数

使用可能なバージョン

get_the_tag_list 関数は WordPress バージョン 2.8.0 以降で利用可能です。

コアファイルのパス

この関数は、wp-includes/taxonomy.php に存在します。

この関数のアクションでの使用可能性

アクション 使用例
mu_plugin_loaded
registered_post_type
plugins_loaded
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init
register_sidebar
wp_loaded
send_headers
parse_query
pre_get_posts
wp
template_redirect
get_header
wp_head

サンプルコード

サンプルコード 1: 投稿詳細ページでタグを表示

if ( has_tag() ) {
    echo get_the_tag_list( '<p>Tags: ', ', ', '</p>' );
}

このコードは、現在の投稿にタグが存在する場合に、投稿詳細ページでタグを表示します。

サンプルコード 2: サイドバーウィジェットでタグを表示

function my_tag_list_widget() {
    echo '<div class="tag-list">';
    echo get_the_tag_list( '<h3>Related Tags: ', ', ', '</h3>' );
    echo '</div>';
}

この関数はカスタムウィジェット内で、関連するタグを表示します。

サンプルコード 3: タグを独自のスタイルで表示

echo get_the_tag_list( '<div class="custom-tags">Tags: ', ', ', '</div>' );

このコードは、タグをカスタムのHTML構造の中に入れて表示します。

サンプルコード 4: 投稿のメタデータにタグを追加

add_action( 'the_content', 'add_tags_to_content' );
function add_tags_to_content( $content ) {
    $tags = get_the_tag_list( '', ', ' );
    return $content . '<div class="post-tags">Tags: ' . $tags . '</div>';
}

投稿の内容の後に、タグをメタデータとして追加しています。

サンプルコード 5: タグの有無で表示を変える

$tags = get_the_tag_list( '', ', ' );
if ( $tags ) {
    echo '<div class="tags">Tags: ' . $tags . '</div>';
} else {
    echo '<p>No tags available.</p>';
}

タグが存在するかを確認し、存在しない場合にはメッセージを表示します。

この関数について質問する


上の計算式の答えを入力してください