[ひげガール]

【お使いの Snow Monkey のバージョン】バージョン: 28.0.8
【お使いの Snow Monkey Blocks のバージョン】バージョン 23.1.2
【お使いの Snow Monkey Editor のバージョン】バージョン 10.2.0
【お使いのブラウザ】Chrome
【当該サイトのURL】

### 実現したいこと

サイトロゴのATLタグを個別に変更したい。

### 発生している問題

サイトロゴのATLタグはサイトタイトルが自動的に排出されると思います。

MY Snow monkey にPHP を書くことで、メディア上で設定した個別のALTタグを排出したいです。

目的はSEO対策になります。

### 試したこと

皆さま、こんにちは。
春の陽気が心地よい季節となりましたが、いかがお過ごしでしょうか。

日頃よりこのフォーラムでたくさんの知恵を学ばせていただき、心より感謝しております。
このたび、上記の件で行き詰まっており、もしお時間がありましたらご助言をいただけますと幸いです。

お忙しいところ恐縮ですが、どうぞよろしくお願いいたします。
新緑の美しい季節、皆さまのご健勝とご活躍をお祈り申し上げます。

本当に感謝しています。

♥ 0

Who liked: No user

[まーちゅう]

/**
 * WordPressのコア関数 the_custom_logo() が使用する
 * wp_get_attachment_image_attributes フィルターを利用して
 * サイトロゴのALT属性をカスタマイズします。
 */
add_filter(
	'wp_get_attachment_image_attributes',
	function ( $attr, $attachment ) {
		// カスタムロゴのIDを取得
		$custom_logo_id = get_theme_mod( 'custom_logo' );

		// 現在処理中の画像がサイトロゴかどうか確認
		if ( $custom_logo_id && $attachment->ID === (int) $custom_logo_id ) {
			// メディアライブラリで設定されたALT属性を取得
			$custom_alt = get_post_meta( $attachment->ID, '_wp_attachment_image_alt', true );

			// カスタムALT属性が存在する場合は、それを使用
			if ( ! empty( $custom_alt ) ) {
				$attr['alt'] = $custom_alt;
			}
		}

		return $attr;
	},
	10,
	3
);

こちらのコードを My Snow Monkey に追加すれば、メディアに設定した代替テキストと入れ替えることが出来ますが、SEO目的ならトップページの H1 をどうするか？もう少し考える必要がありそうです。

♥ 1

Who liked:

[まーちゅう]

補足：SEO対策として考えるのなら
上のコードそのままだとトップページのH1が「メディア上で設定した個別のALT」になってしまう

<h1 class="c-site-branding__title">
	<a href="https://example.com/" class="custom-logo-link" rel="home" aria-current="page">
		<img width="484" height="98" src="https://example.com/wp-content/uploads/2023/05/logo-horizontal.png" class="custom-logo" alt="メディア上で設定した個別のALT">
	</a>
</h1>

条件分岐してトップページでは、<span class="screen-reader-text"><?php bloginfo( 'name' ); ?></span>のようにH1にサイトネームが入るようにする必要があると思います。

<h1 class="c-site-branding__title">
	<a href="https://example.com/" class="custom-logo-link" rel="home" aria-current="page">
		<img width="484" height="98" src="https://example.com/wp-content/uploads/2023/05/logo-horizontal.png" class="custom-logo" alt="メディア上で設定した個別のALT">
		<span class="screen-reader-text"><?php bloginfo( 'name' ); ?></span>
	</a>
</h1>

♥ 1

Who liked:

[キタジマ タカシ]

ヘッダーのサイトロゴは内部的には the_custom_logo() → get_custom_logo() を使っているのですが、get_custom_logo() の中には get_custom_logo_image_attributes というフィルターフックがあるみたいなのでこれも使えそうな気がします。

get_custom_logo() – Function | Developer.WordPress.org

Returns a custom logo, linked to home unless the theme supports removing the link on the home page.

developer.wordpress.org

♥ 1

Who liked:

[ひげガール]

まーちゅうさん、キタジマさん、こんにちは！

この度は、いろいろと相談に乗っていただき、ありがとうございました💐

お二人の温かい言葉と丁寧なアドバイスのおかげで、無事解決しました！

不安だった気持ちが、春の芽吹きみたいに、希望に変わりました🌱

本当に感謝の気持ちでいっぱいです！

これからもどうぞよろしくお願いします！

♥ 1

Who liked:

[投稿者]

投稿