Connexion
SharePoint Online: Display Country Flags using JSON Formatting – multiple selections
SharePoint Online JSON formatting is a powerful tool that allows users to customize the display of list data, bringing a new level of functionality and aesthetics to SharePoint online lists. In my previous blog post, we saw how to show country flags using SharePoint JSON formatting for single selection choice column.
The JSON formatting sample given in this blog post demonstrates displaying flags of the counties selected in the multiple selection SharePoint choice column.
The country flags are shown using the FlagCDN – CDN & API of flags web site API. As Microsoft have blocked the external domain images in SharePoint JSON formatting by default, you will have to allow the flagcdn.com domain in HTML Field Security settings of your SharePoint site by following this step by step guide: Why external domain image URLs are not working in SharePoint Online JSON Formatting?
Also, You can find the list of countries used in this JSON sample at: List of Countries.
Multiple selection choice column settings
Add list of countries in the choice column settings like:
SharePoint Online JSON sample
Use below JSON to apply JSON column formatting for multiple selection SharePoint choice column to show the flag of selected countries:
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
"elmType": "div",
"inlineEditField": "[$Countries]",
"children": [
{
"elmType": "div",
"style": {
"display": "flex",
"flex-direction": "column",
"justify-content": "flex-start",
"flex-wrap": "wrap",
"margin": "5px 0px"
},
"children": [
{
"elmType": "div",
"forEach": "choiceIterator in @currentField",
"style": {
"margin": "3px 0px",
"display": "flex",
"flex-direction": "row",
"align-items": "center"
},
"children": [
{
"elmType": "img",
"attributes": {
"src": "=if([$choiceIterator],'https://flagcdn.com/w550/' + if([$choiceIterator]=='Afghanistan','af',if([$choiceIterator]=='Albania','al',if([$choiceIterator]=='Algeria','dz',if([$choiceIterator]=='American Samoa','as',if([$choiceIterator]=='Andorra','ad',if([$choiceIterator]=='Angola','ao',if([$choiceIterator]=='Anguilla','ai',if([$choiceIterator]=='Antarctica','aq',if([$choiceIterator]=='Antigua and Barbuda','ag',if([$choiceIterator]=='Argentina','ar',if([$choiceIterator]=='Armenia','am',if([$choiceIterator]=='Aruba','aw',if([$choiceIterator]=='Australia','au',if([$choiceIterator]=='Austria','at',if([$choiceIterator]=='Azerbaijan','az',if([$choiceIterator]=='Bahamas','bs',if([$choiceIterator]=='Bahrain','bh',if([$choiceIterator]=='Bangladesh','bd',if([$choiceIterator]=='Barbados','bb',if([$choiceIterator]=='Belarus','by',if([$choiceIterator]=='Belgium','be',if([$choiceIterator]=='Belize','bz',if([$choiceIterator]=='Benin','bj',if([$choiceIterator]=='Bermuda','bm',if([$choiceIterator]=='Bhutan','bt',if([$choiceIterator]=='Bolivia','bo',if([$choiceIterator]=='Bonaire','bq',if([$choiceIterator]=='Bosnia and Herzegovina','ba',if([$choiceIterator]=='Botswana','bw',if([$choiceIterator]=='Bouvet Island','bv',if([$choiceIterator]=='Brazil','br',if([$choiceIterator]=='British Indian Ocean Territory','io',if([$choiceIterator]=='Brunei','bn',if([$choiceIterator]=='Bulgaria','bg',if([$choiceIterator]=='Burkina Faso','bf',if([$choiceIterator]=='Burundi','bi',if([$choiceIterator]=='Cambodia','kh',if([$choiceIterator]=='Cameroon','cm',if([$choiceIterator]=='Canada','ca',if([$choiceIterator]=='Cape Verde','cv',if([$choiceIterator]=='Cayman Islands','ky',if([$choiceIterator]=='Central African Republic','cf',if([$choiceIterator]=='Chad','td',if([$choiceIterator]=='Chile','cl',if([$choiceIterator]=='China','cn',if([$choiceIterator]=='Christmas Island','cx',if([$choiceIterator]=='Cocos (Keeling) Islands','cc',if([$choiceIterator]=='Colombia','co',if([$choiceIterator]=='Comoros','km',if([$choiceIterator]=='Democratic Republic of the Congo','cd',if([$choiceIterator]=='Cook Islands','ck',if([$choiceIterator]=='Costa Rica','cr',if([$choiceIterator]=='Croatia','hr',if([$choiceIterator]=='Cuba','cu',if([$choiceIterator]=='Cyprus','cy',if([$choiceIterator]=='Czech Republic','cz',if([$choiceIterator]=='Denmark','dk',if([$choiceIterator]=='Djibouti','dj',if([$choiceIterator]=='Dominica','dm',if([$choiceIterator]=='Dominican Republic','do',if([$choiceIterator]=='Ecuador','ec',if([$choiceIterator]=='Egypt','eg',if([$choiceIterator]=='El Salvador','sv',if([$choiceIterator]=='Equatorial Guinea','gq',if([$choiceIterator]=='Eritrea','er',if([$choiceIterator]=='Estonia','ee',if([$choiceIterator]=='Ethiopia','et',if([$choiceIterator]=='Falkland Islands (Malvinas)','fk',if([$choiceIterator]=='Faroe Islands','fo',if([$choiceIterator]=='Fiji','fj',if([$choiceIterator]=='Finland','fi',if([$choiceIterator]=='France','fr',if([$choiceIterator]=='French Guiana','gf',if([$choiceIterator]=='French Polynesia','pf',if([$choiceIterator]=='French Southern Territories','tf',if([$choiceIterator]=='Gabon','ga',if([$choiceIterator]=='Gambia','gm',if([$choiceIterator]=='Georgia','ge',if([$choiceIterator]=='Germany','de',if([$choiceIterator]=='Ghana','gh',if([$choiceIterator]=='Gibraltar','gi',if([$choiceIterator]=='Greece','gr',if([$choiceIterator]=='Greenland','gl',if([$choiceIterator]=='Grenada','gd',if([$choiceIterator]=='Guadeloupe','gp',if([$choiceIterator]=='Guam','gu',if([$choiceIterator]=='Guatemala','gt',if([$choiceIterator]=='Guernsey','gg',if([$choiceIterator]=='Guinea','gn',if([$choiceIterator]=='Guinea-Bissau','gw',if([$choiceIterator]=='Guyana','gy',if([$choiceIterator]=='Haiti','ht',if([$choiceIterator]=='Heard Island and McDonald Islands','hm',if([$choiceIterator]=='Honduras','hn',if([$choiceIterator]=='Hong Kong','hk',if([$choiceIterator]=='Hungary','hu',if([$choiceIterator]=='Iceland','is',if([$choiceIterator]=='India','in',if([$choiceIterator]=='Indonesia','id',if([$choiceIterator]=='Iran','ir',if([$choiceIterator]=='Iraq','iq',if([$choiceIterator]=='Ireland','ie',if([$choiceIterator]=='Isle of Man','im',if([$choiceIterator]=='Israel','il',if([$choiceIterator]=='Italy','it',if([$choiceIterator]=='Jamaica','jm',if([$choiceIterator]=='Japan','jp',if([$choiceIterator]=='Jersey','je',if([$choiceIterator]=='Jordan','jo',if([$choiceIterator]=='Kazakhstan','kz',if([$choiceIterator]=='Kenya','ke',if([$choiceIterator]=='Kiribati','ki',if([$choiceIterator]=='North Korea','kp',if([$choiceIterator]=='South Korea','kr',if([$choiceIterator]=='Kuwait','kw',if([$choiceIterator]=='Kyrgyzstan','kg',if([$choiceIterator]=='Laos','la',if([$choiceIterator]=='Latvia','lv',if([$choiceIterator]=='Lebanon','lb',if([$choiceIterator]=='Lesotho','ls',if([$choiceIterator]=='Liberia','lr',if([$choiceIterator]=='Libya','ly',if([$choiceIterator]=='Liechtenstein','li',if([$choiceIterator]=='Lithuania','lt',if([$choiceIterator]=='Luxembourg','lu',if([$choiceIterator]=='Macao','mo',if([$choiceIterator]=='North Macedonia','mk',if([$choiceIterator]=='Madagascar','mg',if([$choiceIterator]=='Malawi','mw',if([$choiceIterator]=='Malaysia','my',if([$choiceIterator]=='Maldives','mv',if([$choiceIterator]=='Mali','ml',if([$choiceIterator]=='Malta','mt',if([$choiceIterator]=='Marshall Islands','mh',if([$choiceIterator]=='Martinique','mq',if([$choiceIterator]=='Mauritania','mr',if([$choiceIterator]=='Mauritius','mu',if([$choiceIterator]=='Mayotte','yt',if([$choiceIterator]=='Mexico','mx',if([$choiceIterator]=='Micronesia','fm',if([$choiceIterator]=='Moldova','md',if([$choiceIterator]=='Monaco','mc',if([$choiceIterator]=='Mongolia','mn',if([$choiceIterator]=='Montenegro','me',if([$choiceIterator]=='Montserrat','ms',if([$choiceIterator]=='Morocco','ma',if([$choiceIterator]=='Mozambique','mz',if([$choiceIterator]=='Myanmar','mm',if([$choiceIterator]=='Namibia','na',if([$choiceIterator]=='Nauru','nr',if([$choiceIterator]=='Nepal','np',if([$choiceIterator]=='Netherlands','nl',if([$choiceIterator]=='New Caledonia','nc',if([$choiceIterator]=='New Zealand','nz',if([$choiceIterator]=='Nicaragua','ni',if([$choiceIterator]=='Niger','ne',if([$choiceIterator]=='Nigeria','ng',if([$choiceIterator]=='Niue','nu',if([$choiceIterator]=='Norfolk Island','nf',if([$choiceIterator]=='Northern Mariana Islands','mp',if([$choiceIterator]=='Norway','no',if([$choiceIterator]=='Oman','om',if([$choiceIterator]=='Pakistan','pk',if([$choiceIterator]=='Palau','pw',if([$choiceIterator]=='Palestine','ps',if([$choiceIterator]=='Panama','pa',if([$choiceIterator]=='Papua New Guinea','pg',if([$choiceIterator]=='Paraguay','py',if([$choiceIterator]=='Peru','pe',if([$choiceIterator]=='Philippines','ph',if([$choiceIterator]=='Pitcairn','pn',if([$choiceIterator]=='Poland','pl',if([$choiceIterator]=='Portugal','pt',if([$choiceIterator]=='Puerto Rico','pr',if([$choiceIterator]=='Qatar','qa',if([$choiceIterator]=='Romania','ro',if([$choiceIterator]=='Russia','ru',if([$choiceIterator]=='Rwanda','rw',if([$choiceIterator]=='Saint Barthélemy','bl',if([$choiceIterator]=='Saint Helena, Ascension and Tristan da Cunha','sh',if([$choiceIterator]=='Saint Kitts and Nevis','kn',if([$choiceIterator]=='Saint Lucia','lc',if([$choiceIterator]=='Saint Martin','mf',if([$choiceIterator]=='Saint Pierre and Miquelon','pm',if([$choiceIterator]=='Saint Vincent and the Grenadines','vc',if([$choiceIterator]=='Samoa','ws',if([$choiceIterator]=='San Marino','sm',if([$choiceIterator]=='Sao Tome and Principe','st',if([$choiceIterator]=='Saudi Arabia','sa',if([$choiceIterator]=='Senegal','sn',if([$choiceIterator]=='Serbia','rs',if([$choiceIterator]=='Seychelles','sc',if([$choiceIterator]=='Sierra Leone','sl',if([$choiceIterator]=='Singapore','sg',if([$choiceIterator]=='Sint Maarten','sx',if([$choiceIterator]=='Slovakia','sk',if([$choiceIterator]=='Slovenia','si',if([$choiceIterator]=='Solomon Islands','sb',if([$choiceIterator]=='Somalia','so',if([$choiceIterator]=='South Africa','za',if([$choiceIterator]=='South Georgia and the South Sandwich Islands','gs',if([$choiceIterator]=='South Sudan','ss',if([$choiceIterator]=='Spain','es',if([$choiceIterator]=='Sri Lanka','lk',if([$choiceIterator]=='Sudan','sd',if([$choiceIterator]=='Suriname','sr',if([$choiceIterator]=='Svalbard and Jan Mayen','sj',if([$choiceIterator]=='Swaziland','sz',if([$choiceIterator]=='Sweden','se',if([$choiceIterator]=='Switzerland','ch',if([$choiceIterator]=='Syria','sy',if([$choiceIterator]=='Taiwan','tw',if([$choiceIterator]=='Tajikistan','tj',if([$choiceIterator]=='Tanzania','tz',if([$choiceIterator]=='Thailand','th',if([$choiceIterator]=='Timor-Leste','tl',if([$choiceIterator]=='Togo','tg',if([$choiceIterator]=='Tokelau','tk',if([$choiceIterator]=='Tonga','to',if([$choiceIterator]=='Trinidad and Tobago','tt',if([$choiceIterator]=='Tunisia','tn',if([$choiceIterator]=='Turkey','tr',if([$choiceIterator]=='Turkmenistan','tm',if([$choiceIterator]=='Turks and Caicos Islands','tc',if([$choiceIterator]=='Tuvalu','tv',if([$choiceIterator]=='Uganda','ug',if([$choiceIterator]=='Ukraine','ua',if([$choiceIterator]=='United Arab Emirates','ae',if([$choiceIterator]=='United Kingdom','gb',if([$choiceIterator]=='United States','us',if([$choiceIterator]=='United States Minor Outlying Islands','um',if([$choiceIterator]=='Uruguay','uy',if([$choiceIterator]=='Uzbekistan','uz',if([$choiceIterator]=='Vanuatu','vu',if([$choiceIterator]=='Vatican City','va',if([$choiceIterator]=='Venezuela','ve',if([$choiceIterator]=='Viet Nam','vn',if([$choiceIterator]=='British Virgin Islands','vg',if([$choiceIterator]=='United States Virgin Islands','vi',if([$choiceIterator]=='Wallis and Futuna','wf',if([$choiceIterator]=='Western Sahara','eh',if([$choiceIterator]=='Yemen','ye',if([$choiceIterator]=='Zambia','zm',if([$choiceIterator]=='Zimbabwe','zw','')))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))) + '.png','')",
"title": ""
},
"style": {
"max-width": "50px",
"padding": "0 10px 0 0"
}
},
{
"elmType": "span",
"txtContent": "[$choiceIterator]"
}
]
}
]
}
]
}Where [$Countries] is the internal name of SharePoint choice column. You can get the internal name of your SharePoint list column by following this article: How to find the Internal name of columns in SharePoint Online?
Output
Learn more
- Download Image from SharePoint Image column using JSON formatting
- SharePoint JSON formatting: Check if date & time column is blank/empty
- SharePoint: Highlight selected list item rows using JSON formatting
- SharePoint: Replace All Occurrences of Substring in a String using JSON Formatting
- SharePoint Online: Download files using JSON Formatting
- SharePoint Online: Apply JSON View formatting using PnP PowerShell
