JSON
101 TopicsMultiple-selection-enabled People field properties access for View Formatting.
Hello dears, I've a list with a people field ("Owners") allowing multiple selection. There will always be at least 2 people in that field. Is it somehow possible to access the properties of the people field in the context of View Formatting (RowFormatter) ? I'm pretty sure its not possible to loop through the values of such array but maybe its possible to arbitrarily choose like for the 2 first elements? Something like [$Owners].[0].email ? Thanks for your help!1.2KViews0likes2CommentsGallery view formatting to group in columns
I'd like to know if their is a trick or JSON view formatting I can change so I can group all the items on a list in gallery view are grouped vertically by a certain list value (in this case the region which is a choice field). The image I attached helps explain what I mean. I like the exact card width used because 6 options across works perfectly actually.8.3KViews0likes4CommentsSharepoint online - Guided tours, feature tour, walk throughs
TLDR; Is there a way to create in-app walkthroughs/ guides tours/ feature tours using open source packages like intro.js, chardin.js, joyride, bootstrap, HopScotch, Crumble with Modern SharePoint Online environment? I couldn't find any tutorials for the same. Since I am not a web developer I could not ascertain if this can work with the modern SharePoint Online site pages at all? Long versionI am working on intranet design, using SharePoint online. This intranet serves as a knowledge base, a process workflow reference, and a collaborative tool. I am trying to put together a tutorial so that people can understand what the various web parts are. I have tried using ppt, video, sway, word doc but nothing seems to easy because the user needs to open up two different windows and need to simultaneously walk through both of them. That doesn't work at all for the mobile environment. I researched that websites like walkme, whatfix, inline etc. provide subscription services for the same. I am looking for open source free to use alternatives for the same. My researched shows there are several packages that can help with this, Joyride, intor.js, bootstrap etc. But I cannot ascertain if these can be used with the modern SharePoint online site pages. Could someone guide me to a resource that shows how these and other packages can be set up to use within the SharePoint online environment? Do I need to be worried about privacy and intranet content being exposed to third party apps/ developers if I use these plugins? Any other suggestions on creating walkthroughs for SharePoint online environment that work on mobile and desktop? Any other places where I can post this question? My background: I am not a developer but I tinker with a lot of stuff, I generally use python, VBA, and few visual scripting languages for automation for engineering design and reporting. Any help is appreciated. Thanks, AdityaSolved5.2KViews0likes4CommentsSharePoint List. Gallery Formating
Good morning everyone. I'm trying to use a list to host a series of hyperlink. My list has 3 columns: 1) Title (The default one) 2) Topic (Hyperlink column) 3) Language (Radio button choice) I want to use this list as menu. Similar to the quick link Object in SharePoint (modern). I made all columns but "topic" invisible I created a Gallery view and ensure the column header doesn't appear in all items Now, I have no clue on how to format each tiles. If I make the font size bigger, the bottom of the text is cropped. If I make the size of the box bigger on list, I see the result but it's not reflected on what I see on Sharepoint So, my questions. 1) How to make my boxes larger (in both list and SharePoint) 2) How can I ensure the bottom of my text (The alternative text for the URL) is not cropped (usually the "p, q, g" ) 3) If my text it a bit too long, how can I allow it to take two lines one not only one) 4) How do I remove this little radio button in each tiles ? 5) How do I change the background color of the list object on SharePoint, the background and the background of the tiles ?1.4KViews0likes1CommentTwo JSON questions regarding formatting a Tile View for a SharePoint list
I have a SharePoint list that I have formatted to display in a tile view and because of my lack of knowledge of JSON structure and how it works, I'm not sure how or where to add what I need to bold the column headers and to put a border around each tile. My tiles are very simple and have just three columns I want displayed. I know how to change the sp-card info for the class to get a bolder look but it's bolding the entire column (title AND contents). And there's a soft grey border around each tile and I would like to change the color and bold that as well if possible? Here's what I currently have: { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json", "height": 413, "width": 254, "hideSelection": false, "fillHorizontally": true, "formatter": { "elmType": "div", "attributes": { "class": "sp-card-container" }, "children": [ { "elmType": "div", "attributes": { "class": "sp-card-defaultClickButton" }, "customRowAction": { "action": "defaultClick" } }, { "elmType": "div", "attributes": { "class": "ms-bgColor-white sp-css-borderColor-neutralLight sp-card-borderHighlight sp-card-subContainer" }, "children": [ { "elmType": "div", "attributes": { "class": "sp-card-displayColumnContainer" }, "children": [ { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralPrimary sp-card-label sp-card-highlightedContent" }, "txtContent": "[!Nominees.DisplayName]", "style": { "white-space": "normal", "word-break": "break-word", "font-size": "13px" } }, { "elmType": "p", "attributes": { "title": "[$Nominees]", "class": "ms-fontColor-neutralPrimary sp-card-content sp-card-highlightedContent sp-card-multiline", "role": "heading", "aria-level": "3" }, "txtContent": "=if ([$Nominees] == '', '–', [$Nominees])", "style": { "-webkit-line-clamp": "2", "white-space": "normal", "word-break": "break-word", "font-size": "13px", "height": "30px" } } ] }, { "elmType": "div", "attributes": { "class": "sp-card-displayColumnContainer" }, "children": [ { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralSecondary sp-card-label" }, "txtContent": "[!Why_x0020_have_x0020_they_x0020_.DisplayName]" }, { "elmType": "p", "attributes": { "title": "[$Why_x0020_have_x0020_they_x0020_]", "class": "ms-fontColor-neutralPrimary sp-card-content sp-card-multiline" }, "txtContent": "=if ([$Why_x0020_have_x0020_they_x0020_] == '', '–', [$Why_x0020_have_x0020_they_x0020_])", "style": { "-webkit-line-clamp": "2", "white-space": "normal", "word-break": "break-word", "font-size": "13px", "height": "250px" } } ] }, { "elmType": "div", "attributes": { "class": "sp-card-lastTextColumnContainer" }, "children": [ { "elmType": "p", "attributes": { "class": "ms-fontColor-neutralSecondary sp-card-label" }, "txtContent": "[!Nominator.DisplayName]" }, { "elmType": "p", "attributes": { "title": "[$Nominator]", "class": "ms-fontColor-neutralPrimary sp-card-content " }, "txtContent": "=if ([$Nominator] == '', '–', [$Nominator])" } ] } ] } ] } } And here's what it looks like: Any help is greatly appreciated!2.5KViews1like2CommentsFormat View: Create Tabs Using JSON list Format View
Hello All, I'm new to JSON format view and attempting to create tabs inside of a Document Library. I started with tabs located here: https://github.com/pnp/List-Formatting/tree/master/view-samples/tabs. However, this approach creates tabs for each item, I need the tabs for the entire library which lists my categories (choice 1-3). I'm not entirely sure of the limitation of JSON formatting but it looks like it can be done. I'm just stuck. Here's the look I'm going for (jquery tabs) but with items below it. Tabs are the library categories: Limitations: I cannot use SPFx packages, and I need to save Power Apps as my last resort. Below is a screenshot of what I currently have for my document library. I've grouped my choice in the view. I also have my JSON code below. Any help or guidance would be greatly appreciated. { "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json", "height": 277, "width": 254, "hideSelection": false, "groupProps": { "headerFormatter": { "elmType": "div", "children": [ { "elmType": "div", "style": { "flex-wrap": "wrap", "display": "flex", "box-sizing": "border-box", "padding": "4px 8px 5px 8px", "border-radius": "6px", "align-items": "center", "white-space": "nowrap", "margin": "1px 4px 4px 1px" }, "attributes": { "class": "sp-css-backgroundColor-blueBackground37" }, "children": [ { "elmType": "img", "attributes": {}, "style": { "max-width": "24px", "max-height": "24px", "margin-top": "2px", "border-radius": "2px" } }, { "elmType": "div", "children": [ { "elmType": "span", "style": { "padding": "5px 5px 5px 5px", "font-weight": "500" }, "txtContent": { "operator": "+", "operands": [ "", "@group.fieldData.displayValue" ] } } ] }, { "elmType": "div", "children": [ { "elmType": "div", "style": { "display": "flex", "flex-direction": "row", "justify-content": "center" }, "children": [ { "elmType": "div", "txtContent": "='has ' + @group.count + if(@group.count > '1', ' Documents', ' Document')", "style": { "font-weight": "500" } } ] } ] } ] } ] } } }2.1KViews0likes0Comments