ブログのホームページのフィーチャー画像に代替テキストを追加する

[vrneuman]

一部のテンプレートでは、ブログリスティングページでフィーチャー画像の代替テキストが既定で入力されないことがあります。これにより、ページパフォーマンスツールのリスティングページでSEO警告が表示される場合があります。これを解決する最も簡単な方法は、HubLを使用して、リスティングページに入力するaltタグを追加することです。

• HubSpotアカウントにて、［マーケティング］ > ［ファイルとテンプレート］ > ［デザインツール］の順に進みます。
• ブログテンプレートの名前をクリックします。
• ブログテンプレートで、[ブログコンテンツモジュール］をクリックします。 
• [編集]タブ内のインスペクターで[リスティングテンプレートを編集]をクリックして、コード化されたブログのリスティングテンプレートを開きます。
• alt="{{ content.featured_image_alt_text }}"をフィーチャー画像のimgタグに追加すると、記事エディターで指定した画像の代替テキストがリスティングページの代替テキストに反映されます。

img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image" alt="{{ content.featured_image_alt_text }}"

• または、alt="{{ content.name }}"をフィーチャー画像のimgタグに追加し、リスティングページのaltテキスト属性にブログ記事のタイトルを入力することもできます。

img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image" alt="{{ content.name }}"

注：ブログ記事テンプレートに{{ content.name }}を含めると、記事でHTMLコードのレンダリングが発生する可能性があります。記事テンプレートにラッパーがないブログ記事タイトルを印刷する場合は、代わりにHubL変数{{ page_meta.name }}を使用します。

• [変更を公開]をクリックします。

＊このコンテンツは英語版”Add alt text to the featured image on your blog homepage”を翻訳したものです。