CL Item Attribute for CDN URL of Image Field

Design help Custom code
1

I am trying to setup a custom attribute for each item in a collection list, where the attribute will have the value of the CDN URL of an image that is in an image field in the CMS. I am doing this so I can use add the image to a popup that is created when clicking on a map marker on a Mapbox map. I have been trying to accomplish this by using a code embed in the CL item with the following code:

image
image809×677 29.4 KB

But this code is flawed because it “Contains invalid {{ variables }} that will render as empty when published. Use {{ variables }} to escape.”, this message coming from the Code Embed Editor.

How do I fix this, or is there a better way to accomplish what I am trying to do?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

You’d likely need to use custom code for this.
You’d bind the image to a hidden image field, then retrieve the src and add it to your element.

You may need to explicitly initialize mapbox after you make your DOM changes.