WordPress functions.php

画像の alt（代替テキスト）は、画像が表示できないときや、読み上げソフトで読むときに使われる説明です。検索エンジンも、画像の内容を知る手がかりにしています。

ふだんはメディアの「代替テキスト」に入れていても、記事が増えると入れ忘れが出てきます。このコードは、alt が空、または alt がない画像だけに、その記事のタイトルを自動で入れます。すでに入れている alt は変えません。

/*----------------------------------------------------
 記事内の画像の alt が空・ないときに、記事の題名を入れる
----------------------------------------------------*/
if ( ! function_exists( 'fs_auto_alt_from_title' ) ) {
    function fs_auto_alt_from_title( $content ) {
        if ( is_admin() || false === strpos( $content, '<img' ) ) {
            return $content;
        }

        // 題名はタグを外した元の文字で使う（get_the_title() は記号が &#8211; などに変わるため）
        $title = trim( wp_strip_all_tags( get_post_field( 'post_title', get_the_ID() ) ) );
        if ( '' === $title ) {
            return $content;
        }

        // WordPress 6.2 より前は、HTML を書き換える仕組み（WP_HTML_Tag_Processor）がないので何もしない
        if ( ! class_exists( 'WP_HTML_Tag_Processor' ) ) {
            return $content;
        }

        $tags = new WP_HTML_Tag_Processor( $content );
        while ( $tags->next_tag( 'img' ) ) {
            // 飾りの画像の印（role="presentation"・aria-hidden="true"）があるものは、わざと alt を空にしているので変えない
            if ( 'presentation' === $tags->get_attribute( 'role' ) || 'true' === $tags->get_attribute( 'aria-hidden' ) ) {
                continue;
            }
            $alt = $tags->get_attribute( 'alt' );
            // alt がない（null）・値なしの alt（true）・空白だけの alt のとき、題名を入れる
            if ( null === $alt || true === $alt || '' === trim( (string) $alt ) ) {
                $tags->set_attribute( 'alt', $title );
            }
        }

        return $tags->get_updated_html();
    }
    add_filter( 'the_content', 'fs_auto_alt_from_title', 20 );
}

HTML を安全に書き換える WP_HTML_Tag_Processor を使っています。6.2 より前の WordPress では何もしません。

コードがしていること

• 記事の本文（the_content）を表示する直前に、本文の中の img タグを 1 つずつ見ます。
• alt がない・空・空白だけのときに、記事タイトルを入れます。
• すでに alt が入っている画像は、そのままにします。
• role=”presentation” や aria-hidden=”true” が付いた画像は、飾りとしてわざと alt を空にしているものなので変えません。
• タイトルは HTML のタグを外して使います。「&」や「”」などの記号も、正しく alt に入ります。
• 管理画面では動かしません。

確かめ方

1. コードを追加したあと、alt を入れていない画像がある記事を開きます。
2. 画像を右クリックして「検証」（Chrome の開発ツール）を開くか、ページのソースを表示します。
3. img タグの alt に、記事タイトルが入っていれば成功です。

キャッシュのプラグイン（WP-Optimize など）を使っている場合は、キャッシュを消してから確かめてください。

使うときの注意

• alt は本来、画像ごとの説明を入れるものです。このコードは入れ忘れの保険として使い、大事な画像にはメディアの「代替テキスト」で個別の説明を入れるのがおすすめです。
• 同じ記事の画像には、すべて同じ alt（記事タイトル）が入ります。
• テーマを更新しても消えないように、子テーマの functions.php か、Code Snippets などのプラグインに追加してください。
• 記事の本文の中の画像だけが対象です。アイキャッチやウィジェットの画像は変わりません。

前に載せていたコードからの変更点

以前は、本文の中の「alt=””」という文字を置きかえるだけのコードを載せていました。この方法では、次のことができませんでした。

• alt そのものがない画像（<img src=”…”> だけのもの）には入らない
• タイトルに記号があると、alt の中身が崩れることがある
• 飾りの画像（わざと alt を空にしたもの）にもタイトルが入ってしまう

WordPress 6.2 から使える WP_HTML_Tag_Processor で書き直し、これらに対応しました（2026 年 10 月・WordPress 7.1 で動作を確かめました）。

• the_content（WordPress 開発者リソース）
• WP_HTML_Tag_Processor（WordPress 開発者リソース）