Join the Webstudio community

Updated 2 weeks ago

JS question

I am trying to get a comma between each item in the list. This isn't working. Am i on the right track?
contentfulArtist.data.data.artistsCollection.items[0].artistMediumsCollection.items.map(item => item.artMediumName).join(", ")
This is the artistMediumsCollection array:
Attachment
image.png
J
S
6 comments
"contentfulArtist.data.data.artistsCollection.items[0].artistMediumsCollection.items.map(item => item.artMediumName).join(", ")"

Is that in contentful? I don't think Webstudion allows functions in the expression editor. Maybe you can just concatenate them with: + ", "

This is a guess without seeing your project.
I guess if I can't use a function in the expression editor maybe I could create a function with embed and then use the expression editor to show the result. I'll see.
I built something like this before... let me look and see if I still have it.
Can you do something like this?
Attachment
CleanShot_2025-05-06_at_12.12.522x.png
That works except that you get a comma at the end, which in this case I don't want.
Here's a hack to fix that.
  1. Add a class to the .item
  2. Add a class to the .comma
  3. Add <style> embed of:
    .item:last-child .comma { display: none; }
Not the nicest solution, but it will display what you want. (There can't be any other element at the end of the collection, though.)
Attachment
CleanShot_2025-05-07_at_10.02.272x.png
Add a reply
Sign up and join the conversation on Discord