Forum Discussion
KatherineS-Q
Sep 11, 2023Brass Contributor
Clickable Button on Gallery View Document Library
Hello, I have a document library where social media assets are stored. I would like to create a gallery view of the document library that displays a "Download" button, so when the user selects, ...
- Sep 12, 2023
Hi KatherineS-Q ,
I would put that here{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json", "height": 402, "width": 254, "hideSelection": false, "fillHorizontally": true, "formatter": { "elmType": "div", "attributes": { "class": "sp-card-container" }, "children": [ { "elmType": "div", "attributes": { "class": "sp-card-defaultClickButton" } }, { "elmType": "div", "attributes": { "class": "ms-bgColor-white sp-css-borderColor-neutralLight sp-card-borderHighlight sp-card-subContainer" }, "children": [ { "elmType": "div", "attributes": { "class": "sp-card-previewColumnContainer" }, "children": [ { "elmType": "div", "attributes": { "class": "sp-card-imageContainer" }, "children": [ { "elmType": "filepreview", "attributes": { "src": "@thumbnail.512x432" }, "style": { "height": "200px" }, "filePreviewProps": { "fileTypeIconClass": "sp-fileTypeIcon-cardDesigner", "brandTypeIconClass": "sp-brandTypeIcon-cardDesigner" } } ] } ] }, { "elmType": "div", "attributes": { "class": "sp-card-displayColumnContainer" }, "children": [ { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralSecondary sp-card-label" }, "txtContent": "[!FileLeafRef.DisplayName]" }, { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralPrimary sp-card-content sp-card-highlightedContent sp-card-keyboard-focusable" }, "txtContent": "[$FileLeafRef]", "defaultHoverField": "[$FileLeafRef]" } ] }, { "elmType": "div", "attributes": { "class": "sp-card-displayColumnContainer" }, "children": [ { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralSecondary sp-card-label" }, "txtContent": "[!Title.DisplayName]" }, { "elmType": "p", "attributes": { "title": "[$Title]", "class": "ms-fontColor-neutralPrimary sp-card-content " }, "txtContent": "=if ([$Title] == '', '–', [$Title])" }, { "elmType": "a", "txtContent": "Download", "attributes": { "class": "sp-card-defaultClickButton", "role": "presentation", "target": "_blank", "href": "=@currentWeb+'/_layouts/download.aspx?SourceUrl='+[$FileRef]" }, "style": { "padding": "10px", "height": "32px", "margin-right": "8px", "margin-botton": "10px", "font-size": "14px", "border-radius": "2px", "border": "none", "font-weight": "600", "background-color": "#0078d4", "cursor": "pointer", "color": "white", "text-decoration": "none", "text-align": "center", "width": "65px" } } ] } ] } ] } }
This looks like thisBest Regards,
Sven
ganeshsanap
Sep 12, 2023MVP
Check this article which shows how to download SharePoint files using JSON formatting:
SharePoint Online: Download files using JSON Formatting
Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.
KatherineS-Q
Sep 12, 2023Brass Contributor
Thank you for your response ganeshsanap! Adding the button in the List view works perfectly, but it doesn't work in Gallery view.