Forum Discussion
CJS81000
Mar 05, 2025Copper Contributor
Using Images for Dropdown Options in MS Lists
Greetings,
I have a list on an internal company SharePoint 365 site where I'm trying to add the ability for users to select images instead of text from a choice column.
I've stored the images on the same SharePoint site.
I've added the below JSON code (with the actual links to the images, not the redacted text you see for company and department name) to the choice column's formatting field.
However, the images just show up like this:
Any ideas on what I'm doing wrong?
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
"elmType": "div",
"children": [
{
"elmType": "img",
"style": {
"position": "relative",
"top ": "50%",
"left": "50%",
"width": "24px",
"height": "24px",
"margin-left": "-50%",
"margin-top": "0%"
},
"attributes": {
"img src": "=if(@currentField == 'Consistently Positive', 'https://MYCOMPANYNAME.sharepoint.com/:i:/r/sites/MYDEPARTMENTNAME/Shared%20Documents/_Resources/Trend%20Arrows/consistently%20positive%20trend%20(up%20arrow).png?csf=1&web=1&e=PalSfh', if(@currentField == 'Recently Positive', 'https://MYCOMPANYNAME.sharepoint.com/:i:/r/sites/MYDEPARTMENTNAME/Shared%20Documents/_Resources/Trend%20Arrows/recent%20positive%20trend%20(up-right%20arrow).png?csf=1&web=1&e=faw6kP', if(@currentField == 'Neutral','https://MYCOMPANYNAME.sharepoint.com/:i:/r/sites/MYDEPARTMENTNAME/Shared%20Documents/_Resources/Trend%20Arrows/neutral%20trend%20(right%20arrow).png?csf=1&web=1&e=YbDLiG', if(@currentField == 'Recently Negative','https://MYCOMPANYNAME.sharepoint.com/:i:/r/sites/MYDEPARTMENTNAME/Shared%20Documents/_Resources/Trend%20Arrows/recent%20negative%20trend%20(down-right%20arrow).png?csf=1&web=1&e=hk1MAM', if(@currentField == 'Consistently Negative','https://MYCOMPANYNAME.sharepoint.com/:i:/r/sites/MYDEPARTMENTNAME/Shared%20Documents/_Resources/Trend%20Arrows/consistently%20negative%20trend%20(down%20arrow).png?csf=1&web=1&e=CzakF5')))))"
}
}
]
}
Thanks in advance.
Hi CJS81000
in this Git Repo you can find a lot of examples for JSON formattings, maybe you can find e specific for you: https://github.com/pnp/List-Formatting/tree/master/
Here is an article to using icons in choice columns instead of text: https://learn.microsoft.com/en-us/answers/questions/674879/sharepoint-coloumn-formatting-using-ui-icons-with?WT.mc_id=DX-MVP-5004845
Best, Dave