wp_resource_hints() の説明と使用例

WordPress関数wp_resource_hints()は、ブラウザに対してリソースの事前取得や事前読み込みなどのヒントを提供するために使用されます。

構文

wp_resource_hints( array $urls, string $relation_type );

引数の説明:

$urls (array) — 事前読み込みまたは事前取得するリソースのURLの配列。
$relation_type (string) — リレーションタイプ。例: dns-prefetch, preconnect, prefetch, prerender。

例1: DNSプリフェッチを追加

以下のコードは、指定したドメインに対してDNSプリフェッチを追加します。

<?php
add_filter( 'wp_resource_hints', function( $urls, $relation_type ) {
    if ( 'dns-prefetch' === $relation_type ) {
        $urls[] = 'https://example.com';
    }
    return $urls;
}, 10, 2 );
?>

例2: プリコネクトを設定

特定のリソースに対してプリコネクトを設定する例です。

<?php
add_filter( 'wp_resource_hints', function( $urls, $relation_type ) {
    if ( 'preconnect' === $relation_type ) {
        $urls[] = 'https://fonts.googleapis.com';
    }
    return $urls;
}, 10, 2 );
?>

例3: プレフェッチを追加

リソースを事前取得するためのプレフェッチを追加する例です。

<?php
add_filter( 'wp_resource_hints', function( $urls, $relation_type ) {
    if ( 'prefetch' === $relation_type ) {
        $urls[] = 'https://example.com/resource.js';
    }
    return $urls;
}, 10, 2 );
?>

例4: プリレンダーを設定

次のコードは、特定のURLに対してプリレンダーを設定します。

<?php
add_filter( 'wp_resource_hints', function( $urls, $relation_type ) {
    if ( 'prerender' === $relation_type ) {
        $urls[] = 'https://example.com/next-page';
    }
    return $urls;
}, 10, 2 );
?>

例5: 条件付きでリソースヒントを追加

条件によって異なるリレーションタイプを設定する例です。

<?php
add_filter( 'wp_resource_hints', function( $urls, $relation_type ) {
    if ( is_admin() && 'dns-prefetch' === $relation_type ) {
        $urls[] = 'https://admin.example.com';
    } elseif ( !is_admin() && 'preconnect' === $relation_type ) {
        $urls[] = 'https://cdn.example.com';
    }
    return $urls;
}, 10, 2 );
?>

構文