Poster2 {{header.image.src}} avif

inStacks
1

{{header.image.src}} with an avif file?

2

Could you be more precise? Did you test and failed?

3

yes, fail, read fallback in webp or jpg (from an image plus source).

4

if I don’t put the fallback image, I see an empty picture.

5
6

image plus source displays the avif perfectly, the problem arises with {{header.image.src}}

7

I am reading the src attribute from an img tag. So, no, it won’t work.

8

any solution to put in a coder source to make it work?

9

No.

10

Thank you

11

As workaround, you could try to put the link to the avif into the preview image input field, or custom metadata.

  • custom.metadata
  • preview_image.src
12

it’s a bit too cumbersome like this, thanks anyway

13

preview_image.src works, but I don’t want to create complications in a future update, or in the case of a browser that doesn’t support avif I don’t know how the fall back behaves.

14

For now the simplest way is to leave {{header.image.src}} and insert in the Header Content section an ImageFit or Image(Source) or markdown with remote link of the avif image, if the browser supports it ok, otherwise it is displayed empty.