Querying alt tags for inline images in 11ty site with Sanity media library plugin

Good morning kind Sanity people.
I have been striving to figure out how to display inline images in block content with responsive sizes and alt tags for an 11ty site. I now have the srcset working after reverse engineering
https://github.com/brob/eleventy-plugin-sanity-image . Now I need help to understand how I can query the alt tag for the image from inside my serializer function. I'm using the excellent Sanity media library plugin (https://www.sanity.io/plugins/sanity-plugin-media-library ) to set the alt tags. My serializer function is using @sanity/image-url to query Sanity to build the image urls. How can I query the alt tag I set in the media library?

So I've got it working with an async function but it's clear that I should be materializing the asset fields in the main query, rather than querying for the alt tag individually for each inline image.
My schema has a page document type that contains an array which in turn contains objects.

One of the objects is named 'content' and is comprised of a single block content field. Can anyone help me figure out a groq query to materialise the alt field I need for the inline image in this block content?

I discovered that the media library stores the alt field below sanity.imageAsset

Any help gratefully received as always
😉

title,

slug,

headerBlocks,

mainBlocks[],

...,

_type == "content" => {

...,

blocktext[]{

...,

children[]{

...,

_type == "image" => {

"alt": @.imageAsset->alt,

}

}

}

},

}

Not giving an error, but not materializing the alt field still. Could you have a look for me ?

Are you getting results back as deep in your query as

children[]

?

Thanks for the reply. Yes. I'm getting all the fields back but not the alt.

Is it okay to nest those _type == "" clauses?

I think it should be fine. If you replace

"alt": @.imageAsset->alt,

with

...

, what do you get back?

I seem to get the same result

Do any items of the

children

array have the type of image?

There is no children array in the results. This might be the issue.

I can see mainblocks -> 0 -> blocktext -> 0,1,2,3,4,5,6,7,8

Sounds like it, yes. I might try commenting out all the ellipses to limit noise, then bring them back in once you’re getting your alt data.
Are any of the

blocktext

items

children[]

?

No, they are numbered 0-8

8 holds the image

okay

It’s tough to say without seeing the query result, but maybe remove

children[]{

and its corresponding

}

.

Okay. I'll keep trying. I discovered vision so it should be possible. At least I know I'm not completely off the track now, thanks.

Another approach I might use myself is to remove the entire projection (i.e., get all the data) then Inspect the JSON and trace out the path.

Feel free to post your schema and/or query results (redacting anything private) if you try a bit more and are still stuck.

Thanks I will. I'm really pleased to have got the serializer function working. Getting the alt text in is the icing on the cake!

I applaud your tenacity. We’ll get there! 🙂