Embed Images Stopped Displaying In Sharepoint List Column

Izzal 35 Reputation points
2023-05-18T02:51:42.5833333+00:00

Hi,

I have a Sharepoint List, with 2 colums as selection for countries. Using JSON, I am able to display flag images of each country (not all countries in the world) as shown below with the country name.

[Image

(Fig.1 Selection list with country flag and name)

After filling the form and adding a new item, everything worked well as shown below.[Image

(Fig. 2 List view with the flag image and name displaying)

We have been using this list for a few months, not editing any of the JSON code, when all the sudden the flag images stopped displaying as shown below.

[Image

(Fig. 3 List view with country name but flag image missing)

Country flags are linked to Flagpedia, and does work and display correctly when entered in browser. Strange thing is, when viewed in grid view or form, flag image does display correctly.

[Image

(Fig.4 GRID VIEW with the flag image and name displaying)

As mentioned above, no changes were made in the JSON code. The images just stopped showing all the sudden.

Any clues?

For your reference, below is the code for the above (which did worked normally in Fig.2). ※src is narrowed to only a few country flags, just for this reference.

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "img",
      "attributes": {
        "src": "='https://flagcdn.com/w40/'+ if(@currentField == 'Argentina','ar',if(@currentField == 'Australia','au',if(@currentField == 'Austria','at',if(@currentField == 'Japan','jp',))))+'.png'",
        "title": "=if(@currentField == 0,'','')"
      }
    },
    {
      "elmType": "span",
      "txtContent": "@currentField",
      "style": {
        "padding-left": "6px",
        "white-space": "nowrap",
        "text-transform": "uppercase"
      }
    }
  ]
}
SharePoint
SharePoint
A group of Microsoft Products and technologies used for sharing and managing content, knowledge, and applications.
10,249 questions
{count} votes

Accepted answer
  1. Ganesh Sanap 206 Reputation points MVP
    2023-08-09T07:22:05.68+00:00

    You can fix this issue by adding external site domain from where you are using images (in JSON) in HTML Field Security settings of your SharePoint site - Allow or restrict the ability to embed content on SharePoint pages 

    More information at: Hyperlink/Picture Column suddenly breaks external images in Gallery/Card Designer


    If the answer is helpful, please click "Accept Answer" and kindly upvote it. For SharePoint/Power Platform blogs, visit: Ganesh Sanap Blogs

    2 people found this answer helpful.

1 additional answer

Sort by: Most helpful
  1. Yanli Jiang - MSFT 23,886 Reputation points Microsoft Vendor
    2023-05-29T06:45:47.4766667+00:00

    Hi @lzzal ,

    Yes, I see it. And I also saw other posts with the same issue. It seems that this incident caused a user impact, because the front end has not been modified, the problem may be in the back end, and I do not have permission to view the back end. I have already reported to the product team and am waiting for the feedback, but the time may be longer. If the issue is urgent, I suggest you go to M365 admin center create a new service request to find more professional help.

    service request

    Of course, if there is any progress in the issue, you can also share it here to help more users.


    If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.