SharePoint List Formatting
Back to column formats
Column formattingSharePoint Online

Managed Metadata Values to Buttons

This sample demonstrates changing managed metadata (multiple) values to buttons that open (external) sites, documents or items on other links.

Get this format View on GitHub

Shared by Daniel Giessenburg
Updated Jun 26, 2025

Managed Metadata Values to Buttons formatting preview
Sample preview · View original image

Copy. Apply. Make it yours.

Get this format

1 definition

Review the requirements below, then paste this JSON into the matching formatting panel. Show me where.

Use your list's internal column names and replace any tenant-specific URLs or flow IDs. Formatting is presentation, not a way to secure data.

Column formatting
Download JSON
{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "style": {
    "display":"flex",
    "flex-wrap":"wrap"
  },
  "children": [
    {
      "forEach": "choiceIterator in @currentField",
      "elmType": "div",
      "attributes": {
        "class": "ms-bgColor-gray30",
        "title": "=[$choiceIterator]"
      },
      "style": {
        "text-align": "center",
        "margin": "2px",
        "text-decoration": "none",
        "box-sizing": "border-box",
        "padding": "4px 8px 5px 8px",
        "border-radius": "20px",
        "white-space":"nowrap"
      },
      "children": [
        {
          "elmType": "a",
          "txtContent": "[$choiceIterator]",
          "attributes": {
            "class": "ms-fontColor-sharedGray30 ms-fontColor-black--hover",
            "href": "='[URL]' + [$choiceIterator]",
            "target": "_blank"
          },
          "style": {
            "text-decoration": "none"
          }
        }
      ]
    }
  ]
}
View sourceLink to this definitionmanaged-metadata-button.json

From the contributor

How to use this sample

Summary

This sample demonstrates changing managed metadata (multiple) values to buttons that open (external) sites, documents or items on other links. Myself used this for redirecting users to information, like clients, projects or group related documents.

screenshot of the sample Example of Related client(s) references on a document item within a SharePoint Document library

screenshot of the projects example Example of Related projects(s) references on a document item within a SharePoint Document library

screenshot of the sample Example of Institute Norm reference(s) on a document item within a SharePoint Document library

View requirements

This format can be applied to a Managed Metadata column.

How it works

For every value (term) of the metadata column, create a HTML hyperlink element (<a>) wrapped with a HTML Content Division element (<div>).

Hypertext reference (href) attribute of Hyperlink element (<a>) is loaded with URL (placeholder: [URL]) and the label of term. For example:

  1. [URL] is replaced by: https://[tenant].sharepoint.com/sites/Client-
  2. Term (label) equals Chadailha
  3. Outcome is:
    • Label of button: Chadailha
    • Button action; open new (browser)window with site: https://[tenant].sharepoint.com/sites/Client-Chadailha

How to use

  1. Add a Managed Metadata column to the list/library
  2. Copy JSON to code editor
  3. Replace placeholder [URL], with desired hyperlink
  4. Copy JSON from code editor
  5. Paste JSON in column formatting, custom formatting textbox
  6. Click on Save

Sample

Solution Author(s)
managed-metadata-button.json Daniel Giessenburg

Version history

Version Date Comments
1.0 June 26, 2025 Initial release

Additional Notes

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.