Help Using Multiple CMS Fields as Dynamic Image Alt Text

Hey all,

I have a CMS collection with a bunch of people’s faces. I have a lot of fields that describe the person. For example: hair color, gender, emotion, skin color, etc.

I would like to use these CMS fields to describe my image of the person in the Alt Text. For example, one image’s Alt Text might read "smiling woman with light skin and blonde hair.

I am guessing this is possible using a code embed and dynamic fields. Could someone help get me going?

Here is my read-only link.

Thanks!

Update: Tagging a few people who have thankfully helped me in the past :slight_smile: Any help here is really really appreciated @evekayser @webdev and @samliew

1 Like

Hi again @myonke!

Your read-only link is not working, could you verify please?

Eve Kayser

Gosh, really sorry about that. I changed the project name, so I think that made my read-only link break. Anyways, I updated the link above, and here is my live staging site.

https://faceholders.webflow.io/

Thanks for any help you can offer again man. I have been really stuck on this one haha.

Conceptually what you would need to do is create a new element using an embed within the collection list that could be hidden. Inside the element you would bind collection item fields (see image). When the page renders you now have a text node to grab in a script for the alt text. So you could then use a script to iterate over the image(s) and assign the value of the text node to the alt attribute of the image. Google should be cool with it since it can read the DOM after scripts are run (googlebot).

Shared with CloudApp

It is hard to work with another persons Webflow share when doing custom code since you can’t publish and test and not something I have time to build right now. But this should get you started.

2 Likes

Thank you very much @webdev. I am going to try and implement this with what you’ve given me to start with!

Can anyone help me? I have CMS collections with multi-image field being created/populated from a PHP and JSON script. I need to add alt text attributes to each photo automatically somehow without having to manually go to the images in the CMS and typing in the alt text. There’s no option to choose “Get alt from collection” or anything like that for some reason. Any ideas?