Forum Discussion
Image column format,
- Feb 01, 2024
lidordayan src attribute should be something like this:
"src": "=if([$Image.serverRelativeUrl],[$Image.serverRelativeUrl],@currentWeb+'/Lists/**YOUR-LIST-NAME**/Attachments/'+[$ID]+'/'+[$Image.fileName])"Where Image is the internal name of your SharePoint image column. Also, make sure to edit the above JSON and replace the **YOUR-LIST-NAME** placeholder with your list’s name, as it appears in the list URL (including special characters).
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.
ganeshsanap I'm adding it to the Header formatting for a SharePoint list item, under Configure layout. Thanks in advance.
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"debugMode": false,
"elmType": "div",
"attributes": {
"class": "ms-borderColor-neutralTertiary ms-fontSize-20"
},
"style": {
"font-family": "Segoe UI Light",
"width": "80%",
"border-top-width": "0px",
"border-bottom-width": "1px",
"border-left-width": "0px",
"border-right-width": "0px",
"border-style": "solid",
"margin-bottom": "10px"
},
"children": [
{
"elmType": "div",
"attributes": {
"class": "=if([$Stock_x0020_Level]>[$Re_x002d_orderLevel], 'ms-bgColor-green', 'ms-bgColor-red')"
},
"style": {
"width": "20px",
"height": "100px",
"padding": "6px",
"display": "flex",
"flex-direction": "column",
"align-items": "center"
}
},
{
"elmType": "div",
"attributes": {
"class": "ms-bgColor-themePrimary ms-fontColor-white"
},
"style": {
"margin": "5px",
"width": "100%",
"height": "100px",
"border": "0px",
"padding": "6px",
"display": "flex",
"flex-direction": "column",
"align-items": "center"
},
"children": [
{
"elmType": "div",
"txtContent": "[$Title]",
"attributes": {
"class": "ms-fontWeight-bold"
}
}
]
},
{
"elmType": "img",
"attributes": {
"src": "=if([$ItemImage.serverRelativeUrl],[$ItemImage.serverRelativeUrl],@currentWeb+'/Lists/First%20Aid%20Stock/Attachments/'+[$ID]+'/'+[$ItemImage.fileName])"
},
"style": {
"height": "100px",
"border": "4px ridge"
}
}
]
}
Notnebs I earlier guessed that you might be using the form formatting. Hence I wanted to confirm with you first.
Unfortunately, [$ID] does not work with the JSON form formatting due to some limitation by Microsoft. You can read more about it at: Can ID column be displayed when configuring a list form header using JSON?
Please consider giving a Like if my post helped you in any way.
- NotnebsFeb 19, 2024Copper Contributorganeshsanap, thanks for the reply.
Looks like I will have to remove the image as there appears to be no solution available at this point in time.