【WordPress】カスタムフィールドのURLを取得してリンクを貼る方法｜get_post_meta・セキュリティ・実務パターン完全ガイド

この記事で学べること

• get_post_meta() でカスタムフィールドのURLを取得する基本
• esc_url() / sanitize_url() / FILTER_VALIDATE_URL によるセキュリティ3層防御
• カスタムメタボックスでURL入力欄を作成する方法
• ACF（URL・リンクフィールド）での実装方法
• ショートコード化・WP_Queryフィルタリング・REST API連携
• 7つの実務パターン（参考リンク・SNS・ダウンロード等）

<?php
// カスタムフィールド「custom_url」の値を取得
$custom_url = get_post_meta( get_the_ID(), 'custom_url', true );

// 値が存在する場合のみリンクを表示
if ( $custom_url ) {
    echo '<a href="' . esc_url( $custom_url ) . '">参考サイトはこちら</a>';
}
?>

⚠ 注意：第3引数の $single を省略すると配列が返ります。URLを1つだけ取得する場合は必ず true を指定してください。false（デフォルト）の場合、同じキーに複数の値が登録されているケースでは全て配列で返されます。

⚠ 注意：get_post_custom() と get_post_custom_values() は内部的に get_post_meta() のラッパーです。特別な理由がない限り get_post_meta() を使いましょう。

<?php
$url  = get_post_meta( get_the_ID(), 'ref_url', true );
$text = get_post_meta( get_the_ID(), 'ref_text', true );

if ( $url ) {
    // テキスト未入力時はURLをそのまま表示
    $label = $text ? esc_html( $text ) : esc_url( $url );
    printf(
        '<a href="%s" target="_blank" rel="noopener noreferrer">%s</a>',
        esc_url( $url ),
        $label
    );
}
?>

? ポイント：外部サイトへのリンクには target="_blank" と rel="noopener noreferrer" を付けましょう。noopener はセキュリティ対策（window.opener へのアクセス防止）、noreferrer はリファラー送信の抑制です。

// ① 保存時：サニタイズ + バリデーション
function save_custom_url( $post_id ) {
    $raw_url = $_POST['custom_url'] ?? '';

    // サニタイズ：危険なプロトコル（javascript: 等）を除去
    $sanitized = sanitize_url( $raw_url );

    // バリデーション：正しいURL形式かチェック
    if ( $sanitized && filter_var( $sanitized, FILTER_VALIDATE_URL ) ) {
        update_post_meta( $post_id, 'custom_url', $sanitized );
    } else {
        delete_post_meta( $post_id, 'custom_url' );
    }
}

// ③ 出力時：esc_url() でエスケープ
$url = get_post_meta( get_the_ID(), 'custom_url', true );
if ( $url ) {
    echo '<a href="' . esc_url( $url ) . '">リンク</a>';
}

? 危険な例：以下は絶対にNGです。エスケープなしの出力はXSS攻撃の原因になります。

// ❌ 危険：エスケープなし
echo '<a href="' . $custom_url . '">リンク</a>';

// ❌ 危険：javascript: プロトコルが実行される
// 攻撃者が custom_url に「javascript:alert(1)」を入力した場合
echo '<a href="' . $custom_url . '">クリック</a>';

/**
 * URLを正規化する
 * - スキームなし → https:// を付与
 * - 末尾スラッシュを統一
 * - 不要なクエリパラメータを除去
 */
function normalize_custom_url( $url ) {
    $url = trim( $url );

    // スキームがなければ https:// を付与
    if ( $url && ! preg_match( '#^https?://#i', $url ) ) {
        $url = 'https://' . $url;
    }

    // 末尾スラッシュを統一（パスがある場合は付与）
    $parsed = wp_parse_url( $url );
    if ( isset( $parsed['path'] ) && $parsed['path'] === '%s' ) {
        $url = trailingslashit( $url );
    }

    return sanitize_url( $url );
}

// 使用例
echo normalize_custom_url( 'example.com' );      // https://example.com/
echo normalize_custom_url( 'http://example.com' ); // http://example.com/

/**
 * URL入力用カスタムメタボックスを追加
 */
function add_url_meta_box() {
    add_meta_box(
        'custom_url_box',      // メタボックスID
        '参考リンク',           // タイトル
        'render_url_meta_box',  // コールバック
        'post',                 // 投稿タイプ
        'normal',               // 表示位置
        'high'                  // 優先度
    );
}
add_action( 'add_meta_boxes', 'add_url_meta_box' );

/**
 * メタボックスのHTML出力
 */
function render_url_meta_box( $post ) {
    // nonceフィールド（CSRF対策）
    wp_nonce_field( 'save_custom_url', 'custom_url_nonce' );

    $url  = get_post_meta( $post->ID, 'custom_url', true );
    $text = get_post_meta( $post->ID, 'custom_url_text', true );
    ?>
    <table class="form-table">
        <tr>
            <th><label for="custom_url">URL</label></th>
            <td>
                <input type="url" id="custom_url" name="custom_url"
                       value="<?php echo esc_attr( $url ); ?>"
                       class="large-text" placeholder="https://example.com">
            </td>
        </tr>
        <tr>
            <th><label for="custom_url_text">リンクテキスト</label></th>
            <td>
                <input type="text" id="custom_url_text" name="custom_url_text"
                       value="<?php echo esc_attr( $text ); ?>"
                       class="large-text" placeholder="参考サイト名">
            </td>
        </tr>
    </table>
    <?php
}

? type=”url” について：HTML5の <input type="url"> はブラウザ側でURL形式のバリデーションを行います。ただし、チェックされるのはフォーム送信時のみで、JavaScriptで送信した場合やAjax保存時はバイパスされます。そのため、サーバーサイドでのバリデーションは必須です。

/**
 * メタボックスの値を保存
 */
function save_url_meta_box( $post_id ) {
    // nonce検証
    if ( ! isset( $_POST['custom_url_nonce'] ) ||
         ! wp_verify_nonce( $_POST['custom_url_nonce'], 'save_custom_url' ) ) {
        return;
    }

    // 自動保存時はスキップ
    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
        return;
    }

    // 権限チェック
    if ( ! current_user_can( 'edit_post', $post_id ) ) {
        return;
    }

    // URL：サニタイズ + バリデーション + 保存
    $url = sanitize_url( $_POST['custom_url'] ?? '' );
    if ( $url && filter_var( $url, FILTER_VALIDATE_URL ) ) {
        update_post_meta( $post_id, 'custom_url', $url );
    } else {
        delete_post_meta( $post_id, 'custom_url' );
    }

    // テキスト：サニタイズ + 保存
    $text = sanitize_text_field( $_POST['custom_url_text'] ?? '' );
    update_post_meta( $post_id, 'custom_url_text', $text );
}
add_action( 'save_post', 'save_url_meta_box' );

? セキュリティのポイント：保存処理では必ず①nonce検証（CSRF対策）、②自動保存チェック、③権限チェックの3つを行いましょう。これはWordPressでメタボックスを作成する際の鉄則です。

// ❌ 管理画面のカスタムフィールド欄に表示される
update_post_meta( $post_id, 'custom_url', $url );

// ✅ 管理画面のカスタムフィールド欄に表示されない（推奨）
update_post_meta( $post_id, '_custom_url', $url );

// 取得時も同じプレフィックスを指定
$url = get_post_meta( get_the_ID(), '_custom_url', true );

⚠ 注意：ACFも内部的にアンダースコアプレフィックスを使用しています。ACFフィールドのデータを get_post_meta() で直接取得する場合は、フィールド名の前に _ が付いたメタキーも保存されている点に注意してください（例: reference_url → _reference_url にACFの設定値が格納）。

<?php
$url = get_field( 'reference_url' );

if ( $url ) {
    echo '<a href="' . esc_url( $url ) . '" target="_blank" rel="noopener">参考サイト</a>';
}
?>

<?php
$link = get_field( 'reference_link' );

if ( $link ) {
    $url    = esc_url( $link['url'] );
    $title  = esc_html( $link['title'] );
    $target = $link['target'] ? esc_attr( $link['target'] ) : '_self';

    printf(
        '<a href="%s" target="%s" rel="noopener noreferrer">%s</a>',
        $url,
        $target,
        $title
    );
}
?>

<?php
// 第3引数を false にすると配列で全件取得
$urls = get_post_meta( get_the_ID(), 'ref_urls', false );

if ( ! empty( $urls ) ) {
    echo '<h3>参考リンク</h3>';
    echo '<ul>';
    foreach ( $urls as $url ) {
        if ( filter_var( $url, FILTER_VALIDATE_URL ) ) {
            printf( '<li><a href="%s" target="_blank" rel="noopener">%s</a></li>',
                esc_url( $url ),
                esc_html( $url )
            );
        }
    }
    echo '</ul>';
}
?>

<?php
if ( have_rows( 'reference_links' ) ) : ?>
    <div class="reference-links">
        <h3>参考リンク</h3>
        <ul>
        <?php while ( have_rows( 'reference_links' ) ) : the_row(); ?>
            <li>
                <a href="<?php echo esc_url( get_sub_field( 'url' ) ); ?>"
                   target="_blank" rel="noopener noreferrer">
                    <?php echo esc_html( get_sub_field( 'label' ) ); ?>
                </a>
            </li>
        <?php endwhile; ?>
        </ul>
    </div>
<?php endif; ?>

/**
 * [custom_link key="custom_url" text="参考サイト" new_tab="true"]
 */
function custom_link_shortcode( $atts ) {
    $atts = shortcode_atts( array(
        'key'     => 'custom_url',
        'text'    => '',
        'new_tab' => 'true',
        'class'   => '',
    ), $atts, 'custom_link' );

    $url = get_post_meta( get_the_ID(), sanitize_key( $atts['key'] ), true );

    if ( ! $url || ! filter_var( $url, FILTER_VALIDATE_URL ) ) {
        return '';
    }

    $label  = $atts['text'] ? esc_html( $atts['text'] ) : esc_url( $url );
    $target = ( $atts['new_tab'] === 'true' ) ? ' target="_blank" rel="noopener noreferrer"' : '';
    $class  = $atts['class'] ? ' class="' . esc_attr( $atts['class'] ) . '"' : '';

    return sprintf( '<a href="%s"%s%s>%s</a>', esc_url( $url ), $target, $class, $label );
}
add_shortcode( 'custom_link', 'custom_link_shortcode' );

<!-- 基本的な使い方 -->
[custom_link key="custom_url" text="参考サイトはこちら"]

<!-- 同じタブで開く -->
[custom_link key="custom_url" text="詳しくはこちら" new_tab="false"]

<!-- CSSクラスを付与 -->
[custom_link key="download_url" text="ダウンロード" class="btn btn-primary"]

<?php
$args = array(
    'post_type'      => 'post',
    'posts_per_page' => 10,
    'meta_query'     => array(
        array(
            'key'     => 'custom_url',
            'value'   => '',
            'compare' => '!=',
        ),
    ),
);

$query = new WP_Query( $args );

if ( $query->have_posts() ) :
    while ( $query->have_posts() ) : $query->the_post();
        $url = get_post_meta( get_the_ID(), 'custom_url', true );
        echo '<li><a href="' . esc_url( $url ) . '">' . get_the_title() . '</a></li>';
    endwhile;
    wp_reset_postdata();
endif;
?>

$args = array(
    'post_type'  => 'post',
    'meta_query' => array(
        array(
            'key'     => 'custom_url',
            'value'   => 'example.com',
            'compare' => 'LIKE',
        ),
    ),
);
// → custom_url に「example.com」を含む投稿を取得

function register_custom_url_meta() {
    register_post_meta( 'post', 'custom_url', array(
        'show_in_rest'      => true,
        'single'            => true,
        'type'              => 'string',
        'sanitize_callback' => 'sanitize_url',
        'auth_callback'     => function() {
            return current_user_can( 'edit_posts' );
        },
    ) );
}
add_action( 'init', 'register_custom_url_meta' );

// 取得：GET /wp-json/wp/v2/posts/123
// → レスポンスの meta.custom_url にURLが含まれる

// 更新：POST /wp-json/wp/v2/posts/123
// リクエストボディ：
{
    "meta": {
        "custom_url": "https://example.com/new-url"
    }
}

? ポイント：register_post_meta() で sanitize_callback を設定すると、REST API経由での更新時にも自動でサニタイズが適用されます。auth_callback は認証チェックで、未認証ユーザーによる更新を防ぎます。

// ❌ 不要な最適化（get_post_meta は内部キャッシュがある）
$meta_cache = get_post_meta( get_the_ID() ); // 全メタを変数にキャッシュ
$url  = $meta_cache['custom_url'][0] ?? '';
$text = $meta_cache['custom_text'][0] ?? '';

// ✅ そのまま複数回呼んでOK（DBアクセスは発生しない）
$url  = get_post_meta( get_the_ID(), 'custom_url', true );
$text = get_post_meta( get_the_ID(), 'custom_text', true );

? ポイント：ループ内で同じ投稿の get_post_meta() を複数回呼んでも、パフォーマンスに影響はほぼありません。ただし、ループ外で別の投稿のメタを大量に取得する場合は update_meta_cache() で事前にプリフェッチすると効率的です。

<?php
$url  = get_post_meta( get_the_ID(), 'ref_url', true );
$text = get_post_meta( get_the_ID(), 'ref_text', true );
$desc = get_post_meta( get_the_ID(), 'ref_desc', true );

if ( $url ) : ?>
<div style="border:1px solid #e2e8f0;border-radius:8px;padding:1em;margin:1em 0;">
    <p style="margin:0 0 0.3em;font-size:12px;color:#64748b;">? 参考リンク</p>
    <a href="<?php echo esc_url( $url ); ?>" target="_blank"
       rel="noopener noreferrer"
       style="font-weight:bold;text-decoration:none;">
        <?php echo esc_html( $text ?: $url ); ?>
    </a>
    <?php if ( $desc ) : ?>
        <p style="margin:0.3em 0 0;font-size:13px;color:#64748b;">
            <?php echo esc_html( $desc ); ?>
        </p>
    <?php endif; ?>
</div>
<?php endif; ?>

<?php
$download_url = get_post_meta( get_the_ID(), 'download_url', true );

if ( $download_url ) : ?>
    <a href="<?php echo esc_url( $download_url ); ?>"
       download
       class="download-btn"
       style="display:inline-block;padding:12px 24px;
              background:linear-gradient(135deg,#3b82f6,#2563eb);
              color:#fff;border-radius:8px;text-decoration:none;
              font-weight:bold;transition:transform 0.2s;">
        ⬇ ダウンロード
    </a>
<?php endif; ?>

<?php
$sns_links = array(
    'twitter_url'  => array( 'label' => 'X (Twitter)', 'icon' => '?' ),
    'github_url'   => array( 'label' => 'GitHub',     'icon' => '?' ),
    'website_url'  => array( 'label' => 'Website',    'icon' => '?' ),
);

echo '<div class="sns-links" style="display:flex;gap:12px;">';
foreach ( $sns_links as $key => $info ) {
    $url = get_post_meta( get_the_ID(), $key, true );
    if ( $url && filter_var( $url, FILTER_VALIDATE_URL ) ) {
        printf(
            '<a href="%s" target="_blank" rel="noopener" title="%s">%s</a>',
            esc_url( $url ),
            esc_attr( $info['label'] ),
            $info['icon']
        );
    }
}
echo '</div>';
?>

/**
 * カスタムフィールドにURLがあればパーマリンクを置換
 */
add_filter( 'post_link', function( $permalink, $post ) {
    $external = get_post_meta( $post->ID, 'external_url', true );

    if ( $external && filter_var( $external, FILTER_VALIDATE_URL ) ) {
        return esc_url( $external );
    }

    return $permalink;
}, 10, 2 );

add_action( 'wp_head', function() {
    if ( ! is_singular() ) return;

    $ogp_url = get_post_meta( get_the_ID(), 'ogp_image_url', true );

    if ( $ogp_url && filter_var( $ogp_url, FILTER_VALIDATE_URL ) ) {
        printf(
            '<meta property="og:image" content="%s">' . "\n",
            esc_url( $ogp_url )
        );
    }
} );

<?php
$url = get_post_meta( get_the_ID(), 'custom_url', true );

if ( $url ) {
    // URLが入力されている → 外部リンク
    printf(
        '<a href="%s" target="_blank" rel="noopener">詳細はこちら（外部サイト）</a>',
        esc_url( $url )
    );
} else {
    // URLが未入力 → 投稿自体のパーマリンク
    printf(
        '<a href="%s">詳細はこちら</a>',
        esc_url( get_permalink() )
    );
}
?>

// カラム追加
add_filter( 'manage_posts_columns', function( $columns ) {
    $columns['custom_url'] = 'カスタムURL';
    return $columns;
} );

// カラム内容
add_action( 'manage_posts_custom_column', function( $column, $post_id ) {
    if ( $column === 'custom_url' ) {
        $url = get_post_meta( $post_id, 'custom_url', true );
        if ( $url ) {
            printf( '<a href="%s" target="_blank">%s</a>',
                esc_url( $url ),
                esc_html( wp_trim_words( $url, 5 ) )
            );
        } else {
            echo '—';
        }
    }
}, 10, 2 );