Back to column formats
Column formattingSharePoint 2019SharePoint Online

File Thumbnails or Hyperlinks

This example uses a column to generate a hyperlink to the Item Thumbnail for a document library.

File Thumbnails or Hyperlinks formatting preview
Sample preview · View original image

Copy. Apply. Make it yours.

Get this format

3 definitions

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 example uses a column to generate a hyperlink to the Item Thumbnail for a document library.

  • Uses FileRef Variable
  • Uses getpreview.ashx
  • Adjust the resolution=3 (0-6) value to your NEEDS. (3: 1024px, 4: 1600px)

screenshot of the sample

generic-image-thumbnail

basics from: https://github.com/pnp/List-Formatting/tree/master/column-samples/picture-roundimage-format

  • Adjust Thumbnail Sizes or Rounded Edges to your NEEDS.

screenshot of the sample

View requirements

  • This format can be applied to any column type (the value is ignored)
  • This format should be used in a Document Library

Sample

Solution Author(s)
generic-hyperlink-thumbnail.json Josef Lahmer
generic-image-thumbnail.json Josef Lahmer

Version history

Version Date Comments
1.0 July 17, 2018 Initial release
1.1 August 20, 2018 Switched to Excel-style expressions
1.2 January 9, 2019 Removed hardcoded url and replaced with @currentWeb token
1.3 April 9, 2019 Bug fix in @currentWeb, + generic-image-thumbnail

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.


Additional notes

An additional version using Abstract Tree Syntax (AST) is also provided for environments where the Excel-style expressions are not supported.