Specifying alt text for site-wide social metadata image?

[kthayashi]

Description

Is there currently a way to specify alt text for images in site-wide social metadata (twitter-card, open-graph) for a Quarto website? I've run into an issue where, when an image with alt text is already specified on a page (e.g. on an About page), specifying an image in _quarto.yml overrides the existing image but fails to alter the alt text in the HTML metadata for that page. Here's some code for a minimal website to reproduce this issue:

_quarto.yaml:

project:
  type: website

website:
  title: Test
  navbar:
    left:
      - href: "index.qmd"
        text: About
  site-url: "https://www.example.com/"
  twitter-card:
    description: Description
    image: "img/thumbnail.png"
    image-alt: Thumbnail
  open-graph:
    description: Description
    image: "img/thumbnail.png"
    image-alt: Thumbnail

YAML header for index.qmd:

title: About
image: "img/headshot.png"
image-alt: Headshot
about:
  template: trestles

Social metadata in rendered _site/index.html:

<meta property="og:title" content="Test - About">
<meta property="og:description" content="Description">
<meta property="og:image" content="https://www.example.com/img/thumbnail.png">
<meta property="og:site-name" content="Test">
<meta property="og:image:height" content="40">
<meta property="og:image:width" content="40">
<meta property="og:image:alt" content="Headshot">
<meta name="twitter:title" content="Test - About">
<meta name="twitter:description" content="Description">
<meta name="twitter:image" content="https://www.example.com/img/thumbnail.png">
<meta name="twitter:image-height" content="40">
<meta name="twitter:image-width" content="40">
<meta name="twitter:image:alt" content="Headshot">
<meta name="twitter:card" content="summary_large_image">

The image pointed to in the HTML metadata does not match the associated alt text, and specifying image-alt in _quarto.yml does not seem to do anything. Or is specifying a site-wide social metadata image in _quarto.yml not an expected use case?

[dragonstyle]

I think this is a bug - we've been improving our support for site wide images and social metadata images and may have just overlooked this scenario. I've opened #6732 for this and will try to fix it soon!

[kthayashi]

That's good to know - thank you for the quick reply!

If I may ask a quick follow-up question on the topic of site wide social metadata images: is there (or will there be) a way to override the site wide image for specific pages (say I want a blog post to use an image specific to that post as opposed to the site wide image)?

[dragonstyle]

You should be able to do this now - by specifying the social metadata keys within the document itself (e.g.

** index.qmd**

 twitter-card:
    description: My Document
    image: "img/thumbnail.png"
    image-alt: Doc alt text

[kthayashi]

Great, thank you again!