next_image_link()

next_image_link()
目次

next_image_link()とは?

next_image_link() は、添付ファイルページ(主に画像)で次の画像へのリンクを生成・出力するテンプレートタグです。

WordPress では投稿や固定ページに画像を「添付ファイル」として登録でき、それぞれの画像に固有の「添付ファイルページ(attachment page)」が自動生成されます。
next_image_link() は、この画像ページ間をスライドのようにナビゲートする機能を実装する際に活躍します。

next_image_link()の基本構文

next_image_link( int $size = 0, string $text = false )

next_image_link()のパラメーターの詳細

パラメーター説明
$sizeint/string出力される画像のサイズ。WordPressの画像サイズ名(例:’thumbnail’ や ‘medium’)または数値(幅)を指定
$textstringリンクテキストを指定。省略または false の場合は画像そのものがリンクになる

next_image_link()の戻り値

next_image_link()値を返さず直接 HTML を出力します(テンプレートタグです)。

next_image_link()の使用例

画像をリンクとして出力する

<?php next_image_link(); ?>

この場合、現在の添付画像ページから「次の添付画像ページ」へのリンクが画像として出力されます。

サムネイルサイズで次の画像へリンク

<?php next_image_link('thumbnail'); ?>

the_attachment_link() などと組み合わせることで、画像一覧 → 個別表示 → 次画像という流れが作れます。

テキストリンクで次画像へジャンプ

<?php next_image_link( 0, '次の画像へ »' ); ?>

このように、テキストを表示したい場合は第2引数に任意の文字列を指定します。

next_image_link()の使用シーン:画像ギャラリーのループ表示

以下は、投稿に添付された画像一覧を添付ファイルページとして表示し、前後にナビゲーションを設置する簡単な例です。

<?php
if ( is_attachment() && wp_attachment_is_image() ) :
?>
    <div class="image-nav">
        <div class="prev"><?php previous_image_link( false, '« 前の画像' ); ?></div>
        <div class="next"><?php next_image_link( false, '次の画像 »' ); ?></div>
    </div>
<?php endif; ?>

添付ファイルの並び順とナビゲーションの仕組み

next_image_link() は、親投稿(親ページ)に添付された画像を**投稿ID順(menu_order)**で並べて、その並びに従って「次の画像」を取得しています。

つまり、画像がアップロードされた順や、編集画面での「順序」フィールドの設定順に依存します。

next_image_link()のカスタマイズ例:画像ギャラリーページ

<?php
if ( is_attachment() && wp_attachment_is_image() ) :
    $attachment_size = apply_filters( 'wp_attachment_image_size', 'large' );
    echo wp_get_attachment_image( get_the_ID(), $attachment_size );

    echo '<div class="image-navigation">';
    previous_image_link( false, '« 前へ' );
    next_image_link( false, '次へ »' );
    echo '</div>';
endif;
?>

このコードは、現在の添付画像を表示し、前後の画像へのリンクを「テキスト」で出力しています。

next_image_link()の注意点

  • この関数は添付ファイルページでのみ使用することを前提としています。
  • 通常の投稿や固定ページでは動作しません。
  • ギャラリーを作成した際の「リンク先」を「添付ファイルのページ」に設定することで、画像クリックで attachment page に遷移できます。

添付ファイルページとは?

WordPressでは、画像やPDFなどのメディアファイルをアップロードすると、各ファイルに「個別ページ」が自動生成されます。これが添付ファイルページ(attachment page)です。

このページでは、画像に対するタイトル、キャプション、説明などを表示できます。
single-attachment.php などでテンプレートをカスタマイズ可能です。

get_next_image_link() はあるの?

いいえ、next_image_link()テンプレートタグ(echo出力専用) であり、
get_next_image_link() という取得専用の関数は WordPress コアには存在しません。

画像のURLだけを取得したい場合は、次のようにカスタムで取得する必要があります。

代替:次の画像のIDとURLを取得する方法

$attachments = array_values( get_children( [
    'post_parent'    => $post->post_parent,
    'post_type'      => 'attachment',
    'post_mime_type' => 'image',
    'orderby'        => 'menu_order ASC, ID ASC'
] ) );

foreach ( $attachments as $k => $attachment ) {
    if ( $attachment->ID == $post->ID ) {
        $next_index = $k + 1;
        if ( isset( $attachments[$next_index] ) ) {
            $next_attachment_url = get_attachment_link( $attachments[$next_index]->ID );
            echo '<a href="' . esc_url( $next_attachment_url ) . '">次の画像へ</a>';
        }
        break;
    }
}

next_image_link()のまとめ

特徴説明
使用目的添付画像ページで「次の画像」へのリンクを作る
出力方法HTMLの <a> タグとしてリンクを出力
引数1画像サイズ(例:’thumbnail’, ‘medium’, 数値など)
引数2テキストリンクにしたい場合の文字列
使用制限添付ファイルページ専用。投稿・固定ページでは無効
補足並び順は menu_order に依存。前画像には previous_image_link() を使用

next_image_link()のよくある活用例

  • 写真ギャラリーで「次へ」「前へ」ナビゲーションを実装
  • 添付画像の閲覧スライド風レイアウト
  • 写真ポートフォリオの実装

WordPress標準のギャラリー機能と組み合わせることで、プラグイン不要でシンプルな画像ナビゲーションが可能です。

next_image_link()previous_image_link() を上手に活用して、洗練されたビジュアルサイトを構築してみてください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

初めてホームページを作成したのは1996年。
2000年よりフリーランスで主に中小企業、学校、各種公的団体、個人事業主のWordPressを活用したホームページ制作を行っています。WordPressテーマはそれぞれのクライアントに合わせて作成しています。
WordPressを活用したサイト運営のための情報発信をしていきます。

目次