Setting open-graph and twitter images for all chapters of a Quarto book

[tamas-ferenci]

Description

I was under the impression that if I set image in _quarto.yml (and set open-graph and twitter-card to true) than that image will be used for all chapters in a Quarto book (where chapters are in different HTML files). This seems to be logical, as one would probably want to see the same sharing image no matter what concrete chapter is shared from the same book.

However, it seems to me that

• In the first chapter (i.e., index.qmd) the cover-image is used as og:image and twitter:image (instead of the image),
• In any subsequent chapter, if the chapter includes at least one image, the first image is used as og:image and twitter:image (instead of the image),
• And image is only used as og:image and twitter:image if the chapter is not the first one and it does not contain a single image.

Isn't it a bug...? Especially because the documentation says "by default, Quarto will use the image value from the format metadata", and this is exactly what I have done, provided an image value in the format metadata -- yet, Quarto will use different image (probably in all cases, if we do not have chapters without image!).

A minimal reproducible example:

_quarto.yml:

project:
  type: book

book:
  title: "Quarto book"
  cover-image: cover.png
  image: ogimage.jpg
  open-graph: true
  twitter-card: true
  chapters:
    - index.qmd
    - chap1.qmd

format:
  html:
    theme: cosmo

index.qmd:

# Preface

Preface

chap1.qmd:

# Chapter 1

![Chapter 1 image](chap1.png)

Now, if you render this, the main page's HTML will include <meta property="og:image" content="cover.png"> (and similarly for twitter:image) while Chapter 1's HTML will include <meta property="og:image" content="chap1.png"> (and similarly for twitter:image). I.e., the image I have set above, ogimage.jpg does not even appear...!

[mcanouil]

Your quote is partial:

The path to a preview image for this content. By default, Quarto will use the image value from the document metadata, or if that isn’t specified, the image value from the website: metadata. If you provide an image, you may also optionally provide an image-width and image-height to improve the appearance of your Twitter Card.

If image is not provided, Quarto will automatically attempt to locate a preview image. For more information, see Preview Images.

Source: https://quarto.org/docs/websites/website-tools.html#social-metadata

Unfortunately as you did not provide a small reproducible example for example using quarto create project book, it's very hard to know if there is a bug, a documentation issue or a misused configuration.

[tamas-ferenci]

Sorry about that, I updated my question with a minimal reproducible example!