Back to view formats
View formattingSharePoint Online

Icon Link Tiles

This sample uses tileProps element to create tile layout on the view. This layout allow users to see the list as the promoted links app (including the power the security trimming on the items). This sample uses the Icons from the Microsoft UI Fabric. The name of the icon is referenced through an Icon field.

Icon Link Tiles 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.

From the contributor

How to use this sample

Summary

This sample creates a collection of links featuring icons (similar to the original promoted links webpart).

screenshot of the sample

View requirements

  • The format expects the following fields:
Field Type
Title Single line of text
Icon Single line of text
URL Hyperlink
NewTab Yes/No - This field is used to open the link the same tab or new tab
  • You need to use the Gallery view.
  • The size of the tile can be adjusted by changing the width and height values.

Sample

Solution Author(s)
icon-link-tiles.json S Merchant, Andrew Taylor

Version history

Version Date Comments
1.0 Septmeber 9, 2018 Initial release
2.0 September 5, 2019 Utilizes tileProps
2.1 September 9, 2019 Minor fixes
3.0 November 18, 2025 The links were not displayed because tileProps was used. This has been fixed.

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.