17 Aug 2023
📺 In this 15 minute developer focused demo, Chris uses the recipe tracker tenplate in Microsoft Lists to show some tips and tricks for List formatting. With SP Formatter extension, he shows how to format operators, introduces us to enhanced formatting experience with Intellisense and Auto-Preview and also discusses to work directly in VS Code. Closing the demo with an overview of arithmetic, conditional and logical, as well as conversion operators, Multi-Value and Loop Operators and Text operators, and Value extraction operators.
This demo is taken from the Microsoft 365 & Power Platform Development Community call August 17th, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenters
Chris Kent (Takeda) | https://twitter.com/theChrisKent
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
This demo is taken from the Microsoft 365 & Power Platform Development Community call August 17th, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenters
Chris Kent (Takeda) | https://twitter.com/theChrisKent
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
- 1 participant
- 16 minutes
3 Aug 2023
📺 In this 17 minute demo, Chris shows how to build a no-code poll app with SharePoint list formatting. He starts with a new site and applying a template and gets two lists in place. He continues with a comprehensive side-by-side view of UX and code for inlineEditField and customRowAction:setValue. He finishes by setting up a Power Automate flow that onboards new team members easily.
This demo is taken from the Microsoft 365 & Power Platform community call 3rd of August 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenter
Chris Kent (Takeda) | @TheChrisKent
📖 Supporting materials
• List formatting on GitHub: https://github.com/pnp/List-Formatting
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
This demo is taken from the Microsoft 365 & Power Platform community call 3rd of August 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenter
Chris Kent (Takeda) | @TheChrisKent
📖 Supporting materials
• List formatting on GitHub: https://github.com/pnp/List-Formatting
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
- 1 participant
- 17 minutes
27 Jul 2023
📺 In this 13 minute developer-focused demo, Dan explains how view formatting and data collection can be hard for end users and walks us through a Web Part he built to ease that workload. He shows how conditional logic may apply within it. After that, he walks us through his code and how to utilize react hooks and more. Closes with an outlook on future iterations.
This demo is taken from the Viva Connections & SharePoint Framework Community call recorded on July 27, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenter
Dan Toft (Evobis) | @tanddant
📖 Supporting materials
• Sample - JSON form builder: https://adoption.microsoft.com/en-us/sample-solution-gallery/sample/pnp-sp-dev-spfx-web-parts-react-json-form/
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
This demo is taken from the Viva Connections & SharePoint Framework Community call recorded on July 27, 2023. Join the next call! Download recurrent invite from https://aka.ms/community/calls
✨ Presenter
Dan Toft (Evobis) | @tanddant
📖 Supporting materials
• Sample - JSON form builder: https://adoption.microsoft.com/en-us/sample-solution-gallery/sample/pnp-sp-dev-spfx-web-parts-react-json-form/
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
- 1 participant
- 14 minutes
20 Jul 2023
📺 In this 17 minute demo, Chris walks us through some more List formatting magic! In the Content Type Gallery, create a new content type. In a SharePoint list, enable the allow management of content types in list settings to then add content types through the add columns menu and customize its options to get a view and add these columns to that view. Also delete the item content type on that list. Add items of different content types to the same list and start to format the view with conditional rules. Enhance that experience with Advanced mode and manipulate the JSON code. Create a board view and get the content type into it!
This community call demo is taken from the bi-weekly Microsoft 365 & Power Platform community call 20th of July 2023. Join the next one by downloading invite from https://aka.ms/community/calls.
✨ Presenter
Chris Kent (Takeda) | @TheChrisKent
📖 Learn more
• PnP List Formatting repository: https://github.com/pnp/List-Formatting
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
This community call demo is taken from the bi-weekly Microsoft 365 & Power Platform community call 20th of July 2023. Join the next one by downloading invite from https://aka.ms/community/calls.
✨ Presenter
Chris Kent (Takeda) | @TheChrisKent
📖 Learn more
• PnP List Formatting repository: https://github.com/pnp/List-Formatting
💡 Learn more about the Microsoft 365 & Power Platform community
• Microsoft 365 & Power Platform Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 & Power Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 & Power Platform - http://aka.ms/community/home
Sharing is caring! You are awesome! 🧡
- 1 participant
- 18 minutes
13 Apr 2023
In this 14-minute developer-focused demo Chris Kent shows viewers how to create a radar chart for visualizing list data. Create an SVG (use Inkscape) - modify paths and apply transforms (Transforms extension), and edit some XML. Convert XML to JSON (with “HTML To Formatter”). Paste SVG JSON into custom List formatting view. Tips on preparing SVG for List Formatting include using absolute paths and only paths, viewBox, and currentColor to utilize theme colors.
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on April 13, 2023.
Demo Presenter
• Chris Kent (Takeda) | @theChrisKent
Community Call Conversation
• aka.ms/Apr13-Demo3
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• Samples - List Formatting Samples | aka.ms/List-Formatting
• Tool – Inkscape | https://inkscape.org/
• Extension - inkscape-applytransforms | https://github.com/Klowner/inkscape-applytransforms
• Tool – HTML To Formatter - https://pnp.github.io/List-Formatting/tools/html-formatter-generator/
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on April 13, 2023.
Demo Presenter
• Chris Kent (Takeda) | @theChrisKent
Community Call Conversation
• aka.ms/Apr13-Demo3
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• Samples - List Formatting Samples | aka.ms/List-Formatting
• Tool – Inkscape | https://inkscape.org/
• Extension - inkscape-applytransforms | https://github.com/Klowner/inkscape-applytransforms
• Tool – HTML To Formatter - https://pnp.github.io/List-Formatting/tools/html-formatter-generator/
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
- 2 participants
- 14 minutes
30 Mar 2023
In this 14-minute developer-focused demo, André Lage who was inspired by static graphics used in PowerPoint, shows ways to enliven data points stored in your SharePoint list. Samples covered include process arrows, lifecycle, content circular, content pyramid, matrix, content box, timelapse, and welcome message. Samples shown are presently or soon will be available in the PnP Samples repository. All samples render well in desktop and mobile views.
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on March 30, 2023.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Community Call Conversation
• aka.ms/Mar30-Demo2
Supporting materials
• Sample - Person circle Header | https://github.com/pnp/List-Formatting/tree/master/form-samples/person-circle-header
• Samples – SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on March 30, 2023.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Community Call Conversation
• aka.ms/Mar30-Demo2
Supporting materials
• Sample - Person circle Header | https://github.com/pnp/List-Formatting/tree/master/form-samples/person-circle-header
• Samples – SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
- 2 participants
- 14 minutes
16 Feb 2023
In this 15-minute developer-focused demo, Federico Sapia shows using Microsoft Lists to track info about people and their work history. Change your thinking from a standard card to a single large CV card footprint using JSON view formatting. Microsoft Lists card elements: In place field editing, expandable editing boxes, custom hovercards and clickable attachments (automation using Power Automate). Field editing box embedded in a card thanks to inlineEditField JSON property. The template is available to you now.
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on February 16, 2023.
Demo Presenter
• Federico Sapia (ANPAL Servizi) | @X365Fede
Community Call Conversation
• https://aka.ms/Feb16-Demo2
Supporting materials
• Sample - Internal CV | https://github.com/pnp/List-Formatting/tree/master/view-samples/internal-cv
• chrome web store - SP Formatter | https://chrome.google.com/webstore/detail/sp-formatter/fmeihfaddhdkoogipahfcjlicglflkhg?hl=en
• Visual Studio Marketplace – SP Formatter | https://marketplace.visualstudio.com/items?itemName=s-kainet.sp-formatter#:~:text=SP%20Formatter%20VSCode%20extension%20creates,to%20browser%20with%20live%20preview.
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on February 16, 2023.
Demo Presenter
• Federico Sapia (ANPAL Servizi) | @X365Fede
Community Call Conversation
• https://aka.ms/Feb16-Demo2
Supporting materials
• Sample - Internal CV | https://github.com/pnp/List-Formatting/tree/master/view-samples/internal-cv
• chrome web store - SP Formatter | https://chrome.google.com/webstore/detail/sp-formatter/fmeihfaddhdkoogipahfcjlicglflkhg?hl=en
• Visual Studio Marketplace – SP Formatter | https://marketplace.visualstudio.com/items?itemName=s-kainet.sp-formatter#:~:text=SP%20Formatter%20VSCode%20extension%20creates,to%20browser%20with%20live%20preview.
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/community/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/community/videos
• Microsoft 365 Platform Community - http://aka.ms/community/home
- 3 participants
- 15 minutes
9 Feb 2023
In this 18-minute developer-focused demo, Michaël Maillot delivers a modified out-of-box form customizer that will get you up and running in no time. The presenter walks viewers through his form customizer article, UI and code while delivering tips for fine tuning and debugging along with a historical reference. One time saver is the ability to toggle between form customizer, list and Item on form. Works only if running SPFx v1.15 or greater.
This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on February 9, 2023.
Demo Presenter
• Michaël Maillot (onepoint) | @michael_maillot
Supporting materials
• Documentation - Build your first Form Customizer extension | https://learn.microsoft.com/sharepoint/dev/spfx/extensions/get-started/building-form-customizer
• Article - [SPFx] Form Customizer Boilerplate | https://michaelmaillot.github.io/tips/20221223-spfx-form-boilerplate/
• Repo - spfx-form-boilerplate | https://github.com/michaelmaillot/spfx-form-boilerplate
• Controls - Dynamic Form | https://pnp.github.io/sp-dev-fx-controls-react/controls/DynamicForm/
• Demo - Episode #223 - Advanced SPFx Form Customizers with DynamicForm | Paolo Pialorsi (PiaSys.com) @paolopia | https://www.youtube.com/watch?v=fuVrosr-NgQ
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
This PnP Community demo is taken from the Viva Connections & SharePoint Framework Bi-weekly sync call recorded on February 9, 2023.
Demo Presenter
• Michaël Maillot (onepoint) | @michael_maillot
Supporting materials
• Documentation - Build your first Form Customizer extension | https://learn.microsoft.com/sharepoint/dev/spfx/extensions/get-started/building-form-customizer
• Article - [SPFx] Form Customizer Boilerplate | https://michaelmaillot.github.io/tips/20221223-spfx-form-boilerplate/
• Repo - spfx-form-boilerplate | https://github.com/michaelmaillot/spfx-form-boilerplate
• Controls - Dynamic Form | https://pnp.github.io/sp-dev-fx-controls-react/controls/DynamicForm/
• Demo - Episode #223 - Advanced SPFx Form Customizers with DynamicForm | Paolo Pialorsi (PiaSys.com) @paolopia | https://www.youtube.com/watch?v=fuVrosr-NgQ
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 18 minutes
2 Feb 2023
In this 20-minute developer-focused demo, Chris Kent delivers three useful tips/tricks. 1) Adding a lookup in your list to display items located in another list. Format multiple items in single list field using forEach to render each item on a new line within the current field – table like formatting. 2) Make a % field look prettier using the Number Battery sample. 3) Appending SharePoint query strings to page/list URLs to effortlessly remove navigation. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on February 2, 2023.
Demo Presenter
• Chris Kent (DMI) | @thechriskent
Community Call Conversation
• aka.ms/Feb2-Demo2
Supporting materials
• Samples - List Formatting Samples | aka.ms/list-formatting
• Sample - Number Battery | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-battery
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Chris Kent (DMI) | @thechriskent
Community Call Conversation
• aka.ms/Feb2-Demo2
Supporting materials
• Samples - List Formatting Samples | aka.ms/list-formatting
• Sample - Number Battery | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-battery
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 20 minutes
8 Dec 2022
In this 28-minute developer-focused demo, Chris Kent shows how for most unformatted/basic columns you can slap the inlineEditField: @currentField on existing formats to make the column editable (click and change). For formatted columns or columns with multi-value formatting, use setValue with actionInput and displayValue to accomplish inline editing capability. See how Chris finds and uses community samples (48 Inline Editing samples), found in the PnP List Formatting Samples repo to support his objective.
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on December 8, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo – PnP List Formatting | https://github.com/pnp/List-Formatting
• Library – Flicon (Fluent UI icon search) | https://flicon.io/
• Sample - Multi-Person Facepile | https://github.com/pnp/List-Formatting/tree/master/column-samples/multi-person-facepile
• Sample - Person Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on December 8, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo – PnP List Formatting | https://github.com/pnp/List-Formatting
• Library – Flicon (Fluent UI icon search) | https://flicon.io/
• Sample - Multi-Person Facepile | https://github.com/pnp/List-Formatting/tree/master/column-samples/multi-person-facepile
• Sample - Person Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 1 participant
- 28 minutes
24 Nov 2022
In this 18-minute developer-focused demo delivered by Chris Kent, find site pages more quickly by using a few atypical and nicely formatted columns for communicating list contents. Start by creating a new view. Expose the Promoted State, Author Byline, and Banner Image columns. Format columns using formatting samples - person-hover-card, image-lightbox and promoted-state-icons from the PnP List Formatting Repo. As well, use icons, counts, colors, and conditions for more clarity. Rearrange columns in view. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on November 24, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo – PnP List Formatting | https://github.com/pnp/List-Formatting
• Library – Flicon (Fluent UI icon search) | https://flicon.io/
• Sample - Person Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
• Sample - Image Lightbox | https://github.com/pnp/List-Formatting/tree/master/column-samples/image-lightbox
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo – PnP List Formatting | https://github.com/pnp/List-Formatting
• Library – Flicon (Fluent UI icon search) | https://flicon.io/
• Sample - Person Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
• Sample - Image Lightbox | https://github.com/pnp/List-Formatting/tree/master/column-samples/image-lightbox
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 1 participant
- 18 minutes
15 Sep 2022
In this 15-minute developer-focused demo, André Lage delivers minimalist design style - 3D look and feel for buttons and graphics applied to 7 newly created JSON neomorphic list formatting controls – Buttons, Options, Rate, Image, Doughnut, Bars, Calendar. The sample controls can be implemented on list columns and views. Create a neomorphic list and distribute it using PowerShell for consistent usage and management across organization. This work inspired by Kristine Kolodziejski. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on September 15, 2022.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Samples - List Formatting Samples | aka.ms/list-formatting
• Video - Taking your Power Apps mobile navigation UI to the next level! – Kristine Kolodziejski (Computacenter) | @kristinekk94 | https://youtu.be/BjhsmcaV2TM
• Videos - Kristine Kolodziejski (channel) | https://www.youtube.com/c/KristineKolodziejski/videos
• Sample - Doughnut Chart | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-doughnut-chart
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Samples - List Formatting Samples | aka.ms/list-formatting
• Video - Taking your Power Apps mobile navigation UI to the next level! – Kristine Kolodziejski (Computacenter) | @kristinekk94 | https://youtu.be/BjhsmcaV2TM
• Videos - Kristine Kolodziejski (channel) | https://www.youtube.com/c/KristineKolodziejski/videos
• Sample - Doughnut Chart | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-doughnut-chart
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 16 minutes
8 Sep 2022
In this 23-minute developer-focused demo, Chris Kent’s solution shows you how to eliminate times aligned to dates for clean date-to-date comparisons. Here’s four functions for Zeroing out dates – Date () (convert text to date based on locale), getDate () (get day of month), getMonth () (get month index), and getYear () (get 4-digit year). In list, display number of days since list item was modified. Show date formatting in list and gallery views. Apply conditional formatting for clarity. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on August 18, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
• Icons - Flicon.io | https://flicon.io/
• Repo - Farrier Community-tooling | https://github.com/pnp/community-tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
• Icons - Flicon.io | https://flicon.io/
• Repo - Farrier Community-tooling | https://github.com/pnp/community-tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 1 participant
- 23 minutes
18 Aug 2022
Do you have a carefully crafted formatted list you want to replicate across the org? In this 7-minute developer-focused demo Chris Kent shows you how to create a custom list template using 3 PowerShell commands. Adds all formatting – list and gallery views to template. Task prerequsites – SharePoint Online PowerShell and Global or SharePoint Admin role. Template creation. Fine-tune your list in the UI, then extract to Site Script (Get-SPOSiteScript), register Site Script (Add-SPOSiteScript), Upload a thumbnail, and register list design (Add-SPOListDesign). This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on August 18, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
• Icons - Flicon.io | https://flicon.io/
• Repo - Farrier Community-tooling | https://github.com/pnp/community-tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
• Icons - Flicon.io | https://flicon.io/
• Repo - Farrier Community-tooling | https://github.com/pnp/community-tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 1 participant
- 7 minutes
7 Jul 2022
In this 15-minute developer-focused demo, Chris Kent shares many exciting updates regarding the List Formatting Repo that address sample inconsistencies, currency and discovery. All samples and documentation have been updated. The Repo has been reorganized including new groupings by Operator, Placeholder Token, Action, Category, Feature, Author, and by Class. Instruction for submissions created. Go behind scenes to learn about the Farrier tool and automations now used to keep the repo up-to-date. Accessing what you need from 250 samples is dramatically easier now. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on July 7, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo - Community-tooling | https://github.com/pnp/Community-Tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Documentation – Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Repo - Community-tooling | https://github.com/pnp/Community-Tooling
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Documentation – Use column formatting to customize SharePoint | aka.ms/spdev-column-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 15 minutes
23 Jun 2022
In this 7-minute developer focused demo, Federico Sapia creates a custom list that captures notes and automatically highlights, groups and sorts by date, is flexible and easy to use, tracks information about activities as well as operations, and is Microsoft Teams ready. Keeps track of attachments (Power Automate) and can be customized further. Each list record has Title, writing box and a tool bar. Edit content in list or on page. All these capabilities packed into this template. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on June 23, 2022.
Demo Presenter
• Federico Sapia (ANPAL Servizi)
Supporting materials
• Article - Keep track of your activities with Microsoft Lists and Power Automate | https://github.com/Fedes365/Microsoft-Lists-Templates/wiki/Keep-track-of-your-activities-with-Microsoft-Lists-and-Power-Automate
• Documentation - Use column formatting to customize SharePoint | https://docs.microsoft.com/sharepoint/dev/declarative-customization/column-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• Federico Sapia (ANPAL Servizi)
Supporting materials
• Article - Keep track of your activities with Microsoft Lists and Power Automate | https://github.com/Fedes365/Microsoft-Lists-Templates/wiki/Keep-track-of-your-activities-with-Microsoft-Lists-and-Power-Automate
• Documentation - Use column formatting to customize SharePoint | https://docs.microsoft.com/sharepoint/dev/declarative-customization/column-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 7 minutes
23 Jun 2022
In this 8-minute developer focused demo, André Lage delivers simple examples of formatting we can implement on a SharePoint page today. Create tabs with associated content. The tabs sample allows you to add an icon or url to image displayed on each Tab. The percentage chart sample displays formatted chart row based on icon/emoji/svg and associated calculated numbers. Add new items to list in Property Pane on page. Edit dates and values alternatively on page or in list. This PnP Community demo is taken from the Microsoft 365 & Power Platform Development Community call recorded on June 23, 2022.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Repo - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Feedback - Microsoft Lists | aka.ms/Feedback/Lists
• Repo - tabs format | https://github.com/pnp/List-Formatting/tree/master/view-samples/tabs
• Repo - Percent chart format | https://github.com/pnp/List-Formatting/tree/master/view-samples/percent-chart-format
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Repo - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Feedback - Microsoft Lists | aka.ms/Feedback/Lists
• Repo - tabs format | https://github.com/pnp/List-Formatting/tree/master/view-samples/tabs
• Repo - Percent chart format | https://github.com/pnp/List-Formatting/tree/master/view-samples/percent-chart-format
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365/community
- 2 participants
- 8 minutes
31 May 2022
In this 11-minute developer-focused demo, Chris Kent shows viewers how to jazz up percentage amounts in a column using a number level bar and then adds a column with localizable textual interpretation of the percentages. Text is localized using the @lcid token (magic). Localizing text in a list side-steps complicated page translations and ensures users in various regions can use your formats without issue. Observe simplicity of copying JSON from sample into the column’s Advance mode formatting box. Scenario draws from 3 samples. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on May 12, 2022.
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Sample - Number Level Bar | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-level-bar
• Sample – Number Localization | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-localization
• Sample – Person Localization | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-localization
• Samples - List Formatting Samples | aka.ms/list-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
Demo Presenter
• Chris Kent (DMI) | @theChrisKent
Supporting materials
• Sample - Number Level Bar | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-level-bar
• Sample – Number Localization | https://github.com/pnp/List-Formatting/tree/master/column-samples/number-localization
• Sample – Person Localization | https://github.com/pnp/List-Formatting/tree/master/column-samples/person-localization
• Samples - List Formatting Samples | aka.ms/list-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
- 2 participants
- 11 minutes
27 May 2022
In this 17-minute developer focused demo, André Lage uses JSON formatting to transform an out-of-box discussion board to next level robust discussion view. Add menu with support features (permission checker, default editing, comments & responses to post), add a custom discussion board timeline view, support information lookup (discussion answers list), and add voting with Emoji’s. leverages existing capabilities – SharePoint page, filter web parts, Microsoft Power Automate (declarative JSON for Flow), and Microsoft Teams. Uses code from 3 PnP samples.
This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on May 12, 2022.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Sample - discussion board format | https://github.com/pnp/List-Formatting/tree/master/view-samples/discussion-board-format
• Sample - Calculator sample | https://github.com/pnp/List-Formatting/tree/master/column-samples/generic-calculator
• Sample - Percent chart format | https://github.com/pnp/List-Formatting/tree/master/view-samples/percent-chart-format
• Samples - List Formatting Samples | aka.ms/list-formatting
• Demo - List formatting magic - Discussion board formatting - André Lage (Datalynx AG) | @aaclage
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on May 12, 2022.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Sample - discussion board format | https://github.com/pnp/List-Formatting/tree/master/view-samples/discussion-board-format
• Sample - Calculator sample | https://github.com/pnp/List-Formatting/tree/master/column-samples/generic-calculator
• Sample - Percent chart format | https://github.com/pnp/List-Formatting/tree/master/view-samples/percent-chart-format
• Samples - List Formatting Samples | aka.ms/list-formatting
• Demo - List formatting magic - Discussion board formatting - André Lage (Datalynx AG) | @aaclage
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
- 2 participants
- 17 minutes
28 Apr 2022
In this 17-minute developer focused demo, André Lage extends existing Kanban Board card view and renders Adaptive Cards in SharePoint, Teams and Planner. Use JSON formatting to add 3 new features to cards - flags, move to top, and expand/collapse. Arrange list data as cards in form of a Kanban board. Manage cards with filtering, menu options, bots, mail forwarding rules, Power Automate flows, use conditional formatting, collect comments, add/delete, move to next stage, and mark as complete. Exemplifies the build once, render anywhere approach. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on April 28, 2022.
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Sample - Board tag format | https://github.com/pnp/List-Formatting/tree/master/view-samples/board-tag-format
• Samples - List Formatting Samples | aka.ms/list-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
Demo Presenter
• André Lage (Datalynx AG) | @aaclage
Supporting materials
• Sample - Board tag format | https://github.com/pnp/List-Formatting/tree/master/view-samples/board-tag-format
• Samples - List Formatting Samples | aka.ms/list-formatting
Learn more
• Microsoft 365 Unified Sample gallery - https://aka.ms/m365/samples
• Microsoft 365 Platform Community in YouTube - https://aka.ms/m365/videos
• Microsoft 365 Platform Community - http://aka.ms/m365pnp
- 2 participants
- 17 minutes
21 Apr 2022
In this 5-minute demo, Luise shows how to get started with automating tasks around workloads in Microsoft Lists with Power Automate. Learn how to send a random item of a list to a Microsoft Teams channel each day as an Adaptive Card 💡
🚀 Presenter: Luise Freese (M365Princess) | @LuiseFreese
Resources:
✔️ https://adaptivecards.io/designer
✔️ https://aka.ms/m365pnp
✔️ https://pnp.github.io/blog
✔️ https://aka.ms/msllists
🚀 Presenter: Luise Freese (M365Princess) | @LuiseFreese
Resources:
✔️ https://adaptivecards.io/designer
✔️ https://aka.ms/m365pnp
✔️ https://pnp.github.io/blog
✔️ https://aka.ms/msllists
- 1 participant
- 5 minutes
13 Apr 2022
In this 30-minute developer focused demo – see what’s new with Microsoft Lists? Your tour guides Harini Saladi, Miceile Barrett and Mark Kashman are happy to show you. New capabilities include visualizing list data with Board view, improved list editors and formatters, lookup fields in modern UX, a seamless experience on Android devices, easier to create custom list templates, find lists in the SharePoint app bar, list templates packaged with business applications/rules, 3 new “life focus” list templates with more to follow. Join the MSA Preview. This PnP Community demo is taken from the weekly Microsoft 365 Platform Community call recorded on March 15, 2022.
Demo Presenters:
• Harini Saladi (Microsoft) | @HariniSaladi
• Miceile Barrett (Microsoft) | @MSFTMiceile
• Mark Kashman (Microsoft) | @mkashman
Supporting materials:
• Tools - Microsoft Lists Resource Center | aka.ms/MSLists
• App - Microsoft Lists – MSA Preview | https://lists.live.com/
• Android Private Preview – https://aka.ms/lists-android-signup (signup seems for be closed for now)
• Samples - Sample Solution Gallery | https://adoption.microsoft.com/sample-solution-gallery
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• See latest list samples in Sample Solution Gallery - Microsoft Adoption | https://adoption.microsoft.com/sample-solution-gallery?product=Microsoft%20Lists
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos
Demo Presenters:
• Harini Saladi (Microsoft) | @HariniSaladi
• Miceile Barrett (Microsoft) | @MSFTMiceile
• Mark Kashman (Microsoft) | @mkashman
Supporting materials:
• Tools - Microsoft Lists Resource Center | aka.ms/MSLists
• App - Microsoft Lists – MSA Preview | https://lists.live.com/
• Android Private Preview – https://aka.ms/lists-android-signup (signup seems for be closed for now)
• Samples - Sample Solution Gallery | https://adoption.microsoft.com/sample-solution-gallery
• Samples - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
• Documentation - Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• See latest list samples in Sample Solution Gallery - Microsoft Adoption | https://adoption.microsoft.com/sample-solution-gallery?product=Microsoft%20Lists
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp/videos
- 3 participants
- 30 minutes
3 Mar 2022
In this 14-minute developer-focused demo, João Ferreira shows how to expose Microsoft To Do (task list) capabilities and similar UI, in Microsoft Lists and in SharePoint. Step through creating a list, tasks, and a To Do view. Review view formatting code for groups, status, title, date, description/notes, tags, attachments, comments, favorites, item detail, edit form, update details, delete task. Very soon the ~500 lines of code for this insertion will be made available in a template in the PnP List Formatting repo. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on March 3, 2022.
Demo Presenter: João Ferreira (Beezy) | @joao12ferreira
Supporting materials:
• Article - How to create a To Do list using SharePoint and Microsoft Lists view formatting – Part 1 | https://lists.handsontek.net/create-list-using-sharepoint-microsoft-lists-view-formatting-part-1/
• Samples - List of View Formatting Samples | https://pnp.github.io/List-Formatting/viewsamples/
• Blog – HANDS ON tek | https://handsontek.net/blog/
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: João Ferreira (Beezy) | @joao12ferreira
Supporting materials:
• Article - How to create a To Do list using SharePoint and Microsoft Lists view formatting – Part 1 | https://lists.handsontek.net/create-list-using-sharepoint-microsoft-lists-view-formatting-part-1/
• Samples - List of View Formatting Samples | https://pnp.github.io/List-Formatting/viewsamples/
• Blog – HANDS ON tek | https://handsontek.net/blog/
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 14 minutes
20 Jan 2022
In this 19-minute developer focused demo, André Lage shares the output of his winter lock down – List Formatting samples categorized by emotions, multiple person, color picker, bar option, slider, and Teams Group. Solutions include discussion board, events mobile and payment. Graphical tree along with LABs (show how handle manual actions from users) for Tic Tac Toe and roll dice. UI/script shown on slides, live in demo. Samples available in List Formatting Repo soon. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on January 20, 2022.
Demo Presenter: André Lage (Datalynx AG) | @aaclage
Supporting materials:
• PnP Samples - List Formatting Samples | https://pnp.github.io/List-Formatting/
• List formatting documentation | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/column-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: André Lage (Datalynx AG) | @aaclage
Supporting materials:
• PnP Samples - List Formatting Samples | https://pnp.github.io/List-Formatting/
• List formatting documentation | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/column-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 19 minutes
29 Nov 2021
In this 12-minute developer focused demo, Chris Kent’s objective here is to make a list with topics and lengthy descriptions more readable and interactive. Create 2 new views (list and gallery) for the same list. Gallery view for button like navigation (topics), and List view to create mini navigation – to move up/down through item descriptions. Use “ID” attribute that links everything together with anchors. Expose views on webpage. All bowser - client-side with out-of-the-box formatting. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on November 11, 2021.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Samples – List Formatting (View samples - Content-browser) | http://github.com/pnp/List-Formatting (Sample available very soon)
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Samples – List Formatting (View samples - Content-browser) | http://github.com/pnp/List-Formatting (Sample available very soon)
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 13 minutes
7 Oct 2021
In this 13-minute developer/citizen developer-focused demo, Chris Kent – starts out creating a list then adds and formats a location column. Adds locations with link to a map and then adds multiple sub properties (street, state, country) under the Location’s name. Add a weather column and formatting to display an image and details for weather. When list items are updated, then weather entries will be updated. Implement this today – get the address and weather samples. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 16, 2021.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Sample - Display Location Address Details | https://github.com/pnp/List-Formatting/tree/master/column-samples/location-address
• Sample - Display Location Weather Details | https://github.com/pnp/List-Formatting/tree/master/column-samples/location-weather
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-video
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Sample - Display Location Address Details | https://github.com/pnp/List-Formatting/tree/master/column-samples/location-address
• Sample - Display Location Weather Details | https://github.com/pnp/List-Formatting/tree/master/column-samples/location-weather
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-video
- 1 participant
- 13 minutes
30 Apr 2021
We are excited to announce the release of a new guided experience in Lists that will make it easy to create business intelligence reports in Power BI using your list data as your source.
List users will see a new menu option in Integrate, then Power BI, then "Visualize this list", which allows users to create a new Power BI report using that list. With just one click, you'll be able to autogenerate a basic report and customize the list columns that are shown in the report. To take further advantage of Power BI, go into Edit mode. Once a report is saved and published, it will appear in the same Power BI submenu under Integrate.
Users with a Microsoft 365 E5 license or Power BI Pro license will have access to the full report authoring and viewing experience. Users without either of those licenses will be prompted by Power BI to sign up for a 60-day free trial of Power BI Pro when they attempt to save a new report or edit or view an existing report. You can turn off self-service sign-up so that the option for a trial is not exposed to List users, click here. Users with a Power BI free license may only visualize their list data but cannot publish nor view reports.
Get started creating in the Power BI service: https://powerbi.microsoft.com/blog/quickly-create-reports-power-bi-service/
Create a list from Excel (video): https://youtu.be/uKtN8Mq6Wdw
Learn more about Microsoft Lists: https://aka.ms/MSLists
List users will see a new menu option in Integrate, then Power BI, then "Visualize this list", which allows users to create a new Power BI report using that list. With just one click, you'll be able to autogenerate a basic report and customize the list columns that are shown in the report. To take further advantage of Power BI, go into Edit mode. Once a report is saved and published, it will appear in the same Power BI submenu under Integrate.
Users with a Microsoft 365 E5 license or Power BI Pro license will have access to the full report authoring and viewing experience. Users without either of those licenses will be prompted by Power BI to sign up for a 60-day free trial of Power BI Pro when they attempt to save a new report or edit or view an existing report. You can turn off self-service sign-up so that the option for a trial is not exposed to List users, click here. Users with a Power BI free license may only visualize their list data but cannot publish nor view reports.
Get started creating in the Power BI service: https://powerbi.microsoft.com/blog/quickly-create-reports-power-bi-service/
Create a list from Excel (video): https://youtu.be/uKtN8Mq6Wdw
Learn more about Microsoft Lists: https://aka.ms/MSLists
- 1 participant
- 8 minutes
29 Apr 2021
In this 16-minute Developer-focused demo, Chris Kent shows formatting capabilities available in a referenced sample. Topic: Field Type = “Lookup.” Lookups get values from a list and have limited formatting options. Of course, this limitation does not deter Chris from showing crazy, crazier, craziest formatting options for lookups. General approach = format the lookup column into which content from the referenced list will flow. Use advanced forEach property. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on April 29, 2021.
Demo Presenter - Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Multi-lookup fields and projected fields | https://github.com/pnp/List-Formatting/tree/master/column-samples/multi-lookup-projected-field
• Demos – Other formatting demos from Chris | https://youtube.com/c/Microsoft365PnPCommunity/search?query=format%20flow
• Documentation – Create list relationships by using unique and lookup columns | https://support.microsoft.com/en-us/office/create-list-relationships-by-using-unique-and-lookup-columns-80a3e0a6-8016-41fb-ad09-8bf16d490632
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter - Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Multi-lookup fields and projected fields | https://github.com/pnp/List-Formatting/tree/master/column-samples/multi-lookup-projected-field
• Demos – Other formatting demos from Chris | https://youtube.com/c/Microsoft365PnPCommunity/search?query=format%20flow
• Documentation – Create list relationships by using unique and lookup columns | https://support.microsoft.com/en-us/office/create-list-relationships-by-using-unique-and-lookup-columns-80a3e0a6-8016-41fb-ad09-8bf16d490632
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 16 minutes
1 Apr 2021
In this 17-minute Developer-focused demo, Chris Kent expands upon a demo delivered in this call on April 1st. In this demo, we are reminded there are layers of formatting options for lists and there is sample code for each layer. Review options for header and footer settings, for groups and entire list, beyond the vanilla capabilities shared previously. Focusing on Collapsed Simple formatting used for Q&A, see usage of groupProps, aggregates, hiding, along with tips on double nesting and more. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on April 1, 2021.
Demo Presenter - Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Documentation - Use view formatting to customize SharePoint | http://docs.microsoft.com/sharepoint/dev/declarative-customization/view-formatting
• Repo - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter - Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Documentation - Use view formatting to customize SharePoint | http://docs.microsoft.com/sharepoint/dev/declarative-customization/view-formatting
• Repo - SharePoint List Formatting Samples | https://github.com/pnp/List-Formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 17 minutes
31 Mar 2021
In this 14-minute Developer-focused demo, Chris Kent’s delivers tips to draw people’s attention to discussions around selected list items by more prominently displaying the number of comments on each item. Accomplish this by using CommentCount, a fluent UI icon and formatting. Be aware of and adjust for differences between how icon containing number renders slightly differently in forms, lists and tiles views. Use sample script in your list today! This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on March 18, 2021.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting documents:
• Documentation - Use column formatting to customize SharePoint | http://aka.ms/spdocs-column-formatting
• Samples – SharePoint List Formatting Samples | http://github.com/pnp/sp-dev-list-formatting
• Repo – Comment Count | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/comment-count
• Repo - Row Index Drawing | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-rowIndex-drawing
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting documents:
• Documentation - Use column formatting to customize SharePoint | http://aka.ms/spdocs-column-formatting
• Samples – SharePoint List Formatting Samples | http://github.com/pnp/sp-dev-list-formatting
• Repo – Comment Count | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/comment-count
• Repo - Row Index Drawing | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-rowIndex-drawing
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 14 minutes
4 Mar 2021
In this 14-minute Developer-focused demo, Chris Kent shares insights on how not to drown in the sea of list formatting options! He starts with UI fundamentals 101 to illustrate the layered approach to formatting and rendering list data. Making changes in one layer may not translate well to other layers. The complexity reducer is to use “columnFormatterReference” that applies changes across all layers or views. Confidently use PnP list formatting samples. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on March 4, 2021.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting documents:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Samples – SharePoint List Formatting Samples | https://github.com/pnp/sp-dev-list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting documents:
• Documentation - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• Samples – SharePoint List Formatting Samples | https://github.com/pnp/sp-dev-list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 14 minutes
22 Feb 2021
In this 11-minute Developer-focused demo, Sergei Sergeev shows latest functionality for customizing your SharePoint Column or View Formatting JSON using full-featured editor instead of out-of-box (OOB). Recently released OOB formatting looks very similar to SP Formatter, but wait, there are differences. What’s new? Live preview, IntelliSense and tool tips for styles and icons, replaceable tokens, context aware suggestions, resizable code workspace, and VS Code Integration Mode with the SP Formatter VSCode extension. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on February 4, 2021.
Demo Presenter: Sergei Sergeev (Mastaq) |@sergeev_srg
Supporting materials:
• Extension – SP Formatter | https://chrome.google.com/webstore/detail/sp-formatter/fmeihfaddhdkoogipahfcjlicglflkhg?hl=en
• Extension - SP Formatter VSCode extension | https://marketplace.visualstudio.com/items?itemName=s-kainet.sp-formatter
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Sergei Sergeev (Mastaq) |@sergeev_srg
Supporting materials:
• Extension – SP Formatter | https://chrome.google.com/webstore/detail/sp-formatter/fmeihfaddhdkoogipahfcjlicglflkhg?hl=en
• Extension - SP Formatter VSCode extension | https://marketplace.visualstudio.com/items?itemName=s-kainet.sp-formatter
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 11 minutes
2 Feb 2021
Microsoft Lists helps you track information across a number of different scenarios. In this demo-heavy video, senior program manager, Miceile Barrett, walks us through new ways the *Edit in grid view* allows you to work quickly, perform bulk actions, and get work done all within the grid editing experience - all in the full fidelity your used to when editing individual items.
► Read the related blog, ""Update information at the speed of type: Edit in grid view" by Miceile Barrett: https://techcommunity.microsoft.com/t5/microsoft-365-blog/update-information-at-the-speed-of-type-edit-in-grid-view/ba-p/2110489
► Learn more about Microsoft Lists: https://aka.ms/MSLists
► Microsoft Lists help documentation: https://aka.ms/MSLists/help
► For more about Microsoft 365: https://www.microsoft.com/microsoft-365
► Read the related blog, ""Update information at the speed of type: Edit in grid view" by Miceile Barrett: https://techcommunity.microsoft.com/t5/microsoft-365-blog/update-information-at-the-speed-of-type-edit-in-grid-view/ba-p/2110489
► Learn more about Microsoft Lists: https://aka.ms/MSLists
► Microsoft Lists help documentation: https://aka.ms/MSLists/help
► For more about Microsoft 365: https://www.microsoft.com/microsoft-365
- 1 participant
- 10 minutes
25 Jan 2021
Microsoft Lists can be configured to meet the unique needs of keeping your work on track. In this demo-heavy video, Senior Program Manager Chakkaradeep Chandran walks us through new ways to make list forms work for you, alongside the ability to add native rules to improve engagement and notifications out to individuals or groups.
► Learn more about Microsoft Lists: https://aka.ms/MSLists
► Microsoft Lists help documentation: https://aka.ms/MSLists/help
► For more about Microsoft 365: https://www.microsoft.com/microsoft-365
► Learn more about Microsoft Lists: https://aka.ms/MSLists
► Microsoft Lists help documentation: https://aka.ms/MSLists/help
► For more about Microsoft 365: https://www.microsoft.com/microsoft-365
- 1 participant
- 10 minutes
21 Jan 2021
In this 17-minute Developer-focused demo, Chris Kent focuses on the new list form called Configure Layout for formatting list Header, Body and Footer. Header and Footer formatting – draw what you want using familiar column formatting syntax. Chris shows the ease of leveraging code samples. Body section formatting has limitations at present. Presenter calls out things to keep in mind when using this new capability that is powerful, not polished. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on January 21, 2021.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Configure the list form | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/list-form-configuration
• Repo - Starter Form Samples | https://github.com/pnp/sp-dev-list-formatting/tree/master/form-samples
• Video – Sharepoint List Formatting From Customization – April Dunnam (Microsoft) | @aprildunnam | https://www.youtube.com/watch?v=wdbGtmFf7bs
• Video – Customize SharePoint List Forms using JSON - Reza Dorrani (Catapult) | @rezadorrani | https://www.youtube.com/watch?v=y_bdjMRHVmY&feature=youtu.be
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Documentation - Configure the list form | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/list-form-configuration
• Repo - Starter Form Samples | https://github.com/pnp/sp-dev-list-formatting/tree/master/form-samples
• Video – Sharepoint List Formatting From Customization – April Dunnam (Microsoft) | @aprildunnam | https://www.youtube.com/watch?v=wdbGtmFf7bs
• Video – Customize SharePoint List Forms using JSON - Reza Dorrani (Catapult) | @rezadorrani | https://www.youtube.com/watch?v=y_bdjMRHVmY&feature=youtu.be
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 17 minutes
19 Jan 2021
Learn all you can do with Microsoft Lists on the go, directly from your iOS device. Join Bharath Manoj Manda (Microsoft program manager - Microsoft Lists) as he shows you how to start a list in several ways - from scratch or ready-made templates. Beyond creation, Bharath demos how to work with favorited and recent lists – ones you own or that have been shared with you. You’ll be able to create both personal lists you own and can share, and team lists owned by members of your teams. And as a bonus, the Lists app for iOS supports offline data consumption and dark mode – lights out, lists on!
App | Get the Microsoft Lists app for iOS from the App Store: https://aka.ms/MSLists/app/iOS
Blog | Learn more in the announcement blog, "Get the Microsoft Lists app for iOS": https://aka.ms/MSLists/app/iOS/blog
Help | Learn how to get started with Microsoft Lists: https://aka.ms/MSLists/help
Resource center | Visit the Microsoft Lists resource center: https://aka.ms/MSLists
App | Get the Microsoft Lists app for iOS from the App Store: https://aka.ms/MSLists/app/iOS
Blog | Learn more in the announcement blog, "Get the Microsoft Lists app for iOS": https://aka.ms/MSLists/app/iOS/blog
Help | Learn how to get started with Microsoft Lists: https://aka.ms/MSLists/help
Resource center | Visit the Microsoft Lists resource center: https://aka.ms/MSLists
- 1 participant
- 5 minutes
10 Dec 2020
In this 10-minute Developer-focused demo, Chris Kent shows an integration of Microsoft Power Automate with list formatting. Specifically, from within a list, request approval using a Flow. In the past to see details on a Flow required going to the Flows UI. Now link directly to the invoked Flow run from the list item. Flow run status is viewed on a hover. Delivers approval status to end-users and troubleshooting details on Flow run status. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on December 10, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo – Generic Flow Status | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-flow-status
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo – Generic Flow Status | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-flow-status
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 10 minutes
12 Nov 2020
In this 18-minute Citizen Developer-focused demo, Leon Armston shows viewers how in approximately 15 minutes, they can add a live London Underground Line Status Board to their intranet using SharePoint and Power Automate. The solution uses Power Automate to provision a SharePoint list and to retrieve and process line status. Solution uses OOB List web part. Leon steps through transforming SharePoint list with view formatting json to reproduce the colorful appearance of the Tube’s status board. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 29, 2020.
Demo Presenter: Leon Armston (Intelogy) | @LeonArmston
Supporting materials:
• Blog - Live London Underground Line Status – SharePoint View Formatting & Power Automate | https://www.leonarmston.com/2020/09/live-london-underground-line-status-sharepoint-view-formatting-power-automate/
• Repo - London Underground Line Status | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/london-tube-status
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Leon Armston (Intelogy) | @LeonArmston
Supporting materials:
• Blog - Live London Underground Line Status – SharePoint View Formatting & Power Automate | https://www.leonarmston.com/2020/09/live-london-underground-line-status-sharepoint-view-formatting-power-automate/
• Repo - London Underground Line Status | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/london-tube-status
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 18 minutes
12 Nov 2020
Site color theme is not flowing through to list tiles? Here is the 14-minute Chris Kent developer focused solution to address this requirement. Time to update hardcoded tile coloring in properties. Extend site theming, using theme sensitive classes, to SVG tile elements like box shadows, borders and fill. The trickery – use absolute and relative positioning to control hovercard behavior for parents and children. The solution works in Microsoft Lists, Microsoft Teams, a SharePoint list, and in a Web part. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on November 12, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Horse Crests | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/horse-crests
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Horse Crests | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/horse-crests
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 14 minutes
29 Oct 2020
In this 9-minute Developer-focused demo, Chris Kent takes the awesome new modern Microsoft List templates and shows viewers how to extend them even further. Specifically, he shows the tiles views – effectively Onboarding Step cards and Planner cards, for 2 View Formatting samples (PnP extensions) – Employee onboarding and Issue Tracker. One may implement the view easily by copying the entire JSON sample file and pasting it in the list Format View’s properties pane. Cards are editable. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on October 15, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Issue Tracker: Planner Cards | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/issue-tracker-planner-cards
• Repo - Employee Onboarding: Steps | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/employee-onboarding-steps
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Repo - Issue Tracker: Planner Cards | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/issue-tracker-planner-cards
• Repo - Employee Onboarding: Steps | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/employee-onboarding-steps
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 9 minutes
17 Sep 2020
In this 14-minute Site Owner-focused demo, Chris Kent steps viewers through the latest list formatting functionality in “design mode” wizards. Formatting capabilities include: view, date/time, choice & multiple choice, number, and yes/no. Capabilities are supported with “conditional” types – rules. Change colors, styles, icons, fonts. All this formatting through UI and no json! Of course you may switch to “Advanced mode” to view/change values in json statements created for you or insert your favorite json sample code. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on September 17, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Doc - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• List Formatting Samples | https://aka.ms/list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Doc - Use column formatting to customize SharePoint | https://aka.ms/spdocs-column-formatting
• List Formatting Samples | https://aka.ms/list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 14 minutes
8 Sep 2020
Did you know you can quickly and easily provide dynamic visualizations directly in List views? Both non-developers and developers can change how fields and rows look in modern list views. We'll cover the basics of getting started and provide tools and resources to take your lists from simple tables to meaningful views that create joy and happiness in the hearts of your users.
Speaker: Chris Kent (DMI) | @thechriskent
Supporting materials:
• Use view formatting to customize SharePoint - https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/view-formatting
• PnP SharePoint List Formatting Samples - https://github.com/pnp/sp-dev-list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices (PnP) community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Speaker: Chris Kent (DMI) | @thechriskent
Supporting materials:
• Use view formatting to customize SharePoint - https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/view-formatting
• PnP SharePoint List Formatting Samples - https://github.com/pnp/sp-dev-list-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices (PnP) community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 1 participant
- 30 minutes
2 Sep 2020
In this 16-minute Site Owner - focused demo, Chris Kent creates a list starting in the central lists index at Office.com that displays new list templates as well as lists you’ve created within Microsoft Lists, SharePoint or shared with you. When creating a new list, choose target site or OneDrive and click Create. The new list adopts site formatting and column types. The property pane offers Wizard-like formatting options or you may format as have always done. Other new features described. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on August 20, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Microsoft Lists Resource Center http://aka.ms/mslists
• Flicon site http://flicon.io/
• Documentation - Use column formatting to customize SharePoint http://aka.ms/spdocs-column-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Microsoft Lists Resource Center http://aka.ms/mslists
• Flicon site http://flicon.io/
• Documentation - Use column formatting to customize SharePoint http://aka.ms/spdocs-column-formatting
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 16 minutes
11 Aug 2020
In this 15-minute Maker focused demo, Chris Kent – suggests an alternative to using icons in a list. Have you thought about inserting Windows emojis? Presently, there are many PnP formatting samples that call for “iconName.” In this demo, you see how easy it is to call Windows emojis – using the "txtContent" text property. Updates in this demo are executed using Sergei Sergeev’s SP Formatter (Chrome Extension) – that provides full formatting using Monaco Editor with instant preview, IntelliSense, find/replace, etc. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on July 23, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Icon Overlays | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-icon-overlay
• Icon Progress Bar | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/number-icon-progressbar
• Multi-Choice Icons | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/multi-choice-icons
• SP Formatter (Chrome Extension) | Sergei Sergeev | @sergeev_srg | https://bit.ly/SP-Formatter
Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Icon Overlays | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/generic-icon-overlay
• Icon Progress Bar | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/number-icon-progressbar
• Multi-Choice Icons | https://github.com/pnp/sp-dev-list-formatting/tree/master/column-samples/multi-choice-icons
• SP Formatter (Chrome Extension) | Sergei Sergeev | @sergeev_srg | https://bit.ly/SP-Formatter
Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos
- 2 participants
- 15 minutes
11 Aug 2020
In this 36-minute Developer/Maker - focused demo, Chakkaradeep “Chaks” Chandran introduces viewers to a new Microsoft Power Automate trigger (Item Modified) and action (Get changed Properties on item) for when SharePoint list items are updated. Owners may specify conditions and time interval in Flows. Update activity is communicated to item owner via Microsoft Teams channel messaging. Upon receiving a notification, owner may initiate a next-step Workflow. Demo plus 12-minute Q&A covering licensing, future enhancements, and more. This PnP Community demo is taken from the SharePoint (PnP) Community call – August 2020 – Monthly sync call recorded on August 11, 2020.
Demo Presenter: Chakkaradeep “Chaks” Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Power Automate Community suggestion - Create a trigger for SharePoint list columns | https://powerusers.microsoft.com/t5/Power-Automate-Ideas/Create-a-trigger-for-SharePoint-list-columns/idi-p/88671?WT.mc_id=m365-15744-cxa
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chakkaradeep “Chaks” Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Power Automate Community suggestion - Create a trigger for SharePoint list columns | https://powerusers.microsoft.com/t5/Power-Automate-Ideas/Create-a-trigger-for-SharePoint-list-columns/idi-p/88671?WT.mc_id=m365-15744-cxa
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 36 minutes
6 Aug 2020
In this 12-minute Site Owner - focused demo, Chris Kent quickly reviews adding icons sourced from Office UI Fabric and Fluent UI to lists. He then introduces viewers to a new source of icons - Flicon.io (beta). The same 2000+ icons reorganized in categories and easily found in search thanks to a.k.a. terms. Easily change icon color and background to fit targeted site theme. Copy icon and paste into a script, export as SVG or drag it onto a PPT slide. This PnP Community demo is taken from the General Microsoft 365 Development Special Interest Group (SIG) - Bi-weekly sync call recorded on August 6, 2020.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• Icon Sources | aka.ms/fluentui | http://uifabricicons.azurewebsites.net/
• Community icon search | https://www.flicon.io/
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Use column formatting to customize SharePoint | aka.ms/spdocs-column-formatting
• Icon Sources | aka.ms/fluentui | http://uifabricicons.azurewebsites.net/
• Community icon search | https://www.flicon.io/
Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos
- 2 participants
- 12 minutes
5 Aug 2020
Microsoft Lists is your smart information tracking app in Microsoft 365.
Learn how to get started with Microsoft Lists from the Microsoft Lists engineers themselves. Start a list from a template, add your information, and then use conditional formatting, rules, and key collaboration features to make the list your own - to make it work across your team. We covered a lot of information with lots of demos.
This webinar was presented by Harini Saladi, Miceile Barrett, Chakkaradeep Chandran and Mark Kashman - all from Microsoft on Wednesday, August 5th, 2020.
Visit the Microsoft Lists resource center: https://aka.ms/MSLists
Review the recent Lists blog announcement: https://aka.ms/MSLists/GA/blog
Learn how to get started with Microsoft Lists from the Microsoft Lists engineers themselves. Start a list from a template, add your information, and then use conditional formatting, rules, and key collaboration features to make the list your own - to make it work across your team. We covered a lot of information with lots of demos.
This webinar was presented by Harini Saladi, Miceile Barrett, Chakkaradeep Chandran and Mark Kashman - all from Microsoft on Wednesday, August 5th, 2020.
Visit the Microsoft Lists resource center: https://aka.ms/MSLists
Review the recent Lists blog announcement: https://aka.ms/MSLists/GA/blog
- 5 participants
- 57 minutes
9 Jul 2020
Get an early look at Microsoft Lists - your smart information tracking app in Microsoft 365. Lincoln will showcase how Lists evolve from SharePoint lists today and how current and new innovation empower individuals and teams to create, share and track information – all in the apps they use every day, including Microsoft Teams. Lots of demos highlighting Lists home, mobile, conditional formatting, fast quick edit, ready-made templates, new views, alerts, flows and more; work tracking with built-in security and compliance. Presented by Lincoln DeMaris, Principal PM - Microsoft).
Learn more about Microsoft Lists: https://aka.ms/MSLists.
Watch the full product demo video with Miceile Barrett: https://aka.ms/MSLists/demo-video.
Learn more about Microsoft 365: https://www.microsoft.com/microsoft-365
Learn more about Microsoft Lists: https://aka.ms/MSLists.
Watch the full product demo video with Miceile Barrett: https://aka.ms/MSLists/demo-video.
Learn more about Microsoft 365: https://www.microsoft.com/microsoft-365
- 1 participant
- 36 minutes
25 Jun 2020
In this 12-minute developer focused demo, Chris Kent reminds us not all pages on a modern site are modern by default and modern pages are not easily customizable, yet we really want to change formatting slightly. See how to create a modern looking Events page using events-format-tiles-only.json (sample found in GitHub view samples gallery). Configure list and tile views - color text, add a hover card/face-pile and/or beautify events list rendering. This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on June 25, 2020
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Use column formatting to customize SharePoint | http://aka.ms/spdocs-column-formatting
• List Formatting Samples | http://aka.ms/list-formatting
• Events Format | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/events-format
• Demo: SharePoint Lists custom formatting - Hover cards | https://www.youtube.com/watch?v=bO2L3eJoT2Y
Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Use column formatting to customize SharePoint | http://aka.ms/spdocs-column-formatting
• List Formatting Samples | http://aka.ms/list-formatting
• Events Format | https://github.com/pnp/sp-dev-list-formatting/tree/master/view-samples/events-format
• Demo: SharePoint Lists custom formatting - Hover cards | https://www.youtube.com/watch?v=bO2L3eJoT2Y
Learn more:
• Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
• Visit the SharePoint PnP Developer Community YouTube channel: https://aka.ms/spdev-videos
- 2 participants
- 12 minutes
30 Apr 2020
In this 18-minute demo delivered by Chris Kent, viewers learn how to take advantage of out-of-the-box hover cards and create custom hover cards in your column or view formatting definitions. This demo is extracted from the bi-weekly Microsoft 365 PnP community – General M365 Developer Special Interest Group (SIG) call recorded April 30, 2020.
⭐ Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
✅ Formatting Documentation | aka.ms/spdocs-column-formatting
✅ Custom Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/custom-hover-card
✅ Person Hover cards| https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
📺 All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
❓ Learn more about the Microsoft 365 Platform community at: http://aka.ms/m365/community
⭐ Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
✅ Formatting Documentation | aka.ms/spdocs-column-formatting
✅ Custom Hover Card | https://github.com/pnp/List-Formatting/tree/master/column-samples/custom-hover-card
✅ Person Hover cards| https://github.com/pnp/List-Formatting/tree/master/column-samples/person-hover-card
📺 All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
❓ Learn more about the Microsoft 365 Platform community at: http://aka.ms/m365/community
- 2 participants
- 18 minutes
16 Apr 2020
This 6-minute site collection admin focused demo delivered by Niket Jain, Microsoft SharePoint Program Manager focused on list capabilities, shows new functions that allow admins to define custom call outs (cards) for column and view formatting that can be commissioned on user defined actions like click or hover. Alternatively, when there is a default hover card, users can now have a profile card or file hover card on formatters that in effect overwrites the default hover experience. This demo is extracted from the bi-weekly Microsoft 365 PnP community – General M365 Developer Special Interest Group (SIG) call recorded April 16, 2020.
Presenter: Niket Jain (Microsoft) | @niketjain2002
Supporting materials:
• Default hover cards - column samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/default-hover-cards
• Custom hover cards- column samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/custom-hover-cards
• Default hover cards - view samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/default-hover-cards
• Custom hover cards - view samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-hover-cards
• Default card on hover via column formatting | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/column-formatting#default-cards-on-hover-via-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
Presenter: Niket Jain (Microsoft) | @niketjain2002
Supporting materials:
• Default hover cards - column samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/default-hover-cards
• Custom hover cards- column samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/custom-hover-cards
• Default hover cards - view samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/default-hover-cards
• Custom hover cards - view samples | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-hover-cards
• Default card on hover via column formatting | https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/column-formatting#default-cards-on-hover-via-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
- 2 participants
- 6 minutes
14 Apr 2020
In this 13-minute demo delivered by Chris Kent, viewers learn how to create a connected contextual doc library page (mini application) by integrating 1st and 3rd party web parts and by using scripts from the sample’s library to format views. Web parts optimized for doc preview, video rendering and form viewer are added to page and all are connected to the List (source) which contains content titles, descriptions, links to videos, surveys, etc. Chris spruces up list items displayed - content title and thumbnail. End result is a nice index of topics delivering a rich on-screen experience, without having to build or buy an app. This demo is extracted from the bi-weekly Microsoft 365 PnP community – General M365 Developer Special Interest Group (SIG) call recorded April 2, 2020.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Video - Web parts working together | http://bit.ly/lf-videobutton
• Formatting Documentation | aka.ms/spdocs-column-formatting
• Generic Video button view sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/generic-video-button
• Document Navigator view sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/document-navigator (coming soon)
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Video - Web parts working together | http://bit.ly/lf-videobutton
• Formatting Documentation | aka.ms/spdocs-column-formatting
• Generic Video button view sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/generic-video-button
• Document Navigator view sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/document-navigator (coming soon)
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/m365pnp
- 1 participant
- 14 minutes
19 Mar 2020
This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on March 19, 2020.
In this 13-minute demo, Chris Kent shows viewers how to update column formatting JSON schema using ARIA attributes to pass information to the ChromeVox (a Chrome extension for the visually impaired) screen reader that verbalizes value/status of a formatted field. Formatting includes adding color (representing a status) and values which may be verbalized as follows: “Hire horse trainers, Progress 'Getting there!' is 75%, cell read only.” This added information makes your formatting truly accessible to all audiences!
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Column formatting documentation: http://aka.ms/spdocs-column-formatting
• ARIA resources: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA
• Formatting sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/number-data-bar
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 13-minute demo, Chris Kent shows viewers how to update column formatting JSON schema using ARIA attributes to pass information to the ChromeVox (a Chrome extension for the visually impaired) screen reader that verbalizes value/status of a formatted field. Formatting includes adding color (representing a status) and values which may be verbalized as follows: “Hire horse trainers, Progress 'Getting there!' is 75%, cell read only.” This added information makes your formatting truly accessible to all audiences!
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Column formatting documentation: http://aka.ms/spdocs-column-formatting
• ARIA resources: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA
• Formatting sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/number-data-bar
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 3 participants
- 14 minutes
19 Mar 2020
This PnP Community demo is taken from the bi-weekly Microsoft 365 – General M365 development Special Interest Group (SIG) community call recorded on March 19, 2020.
In this 12-minute demo, David Warner and Hugo Bernier show off a SPFx Web Part used to put CSS styles on a single page. Capabilities demonstrated include banner formatting, hover effects, tilt list of photos, customize fonts, animations, sprites and more. Why not use an SPFx Extension for CSS? Extensions affect every page in a site collection whereas a web part affects only the pages on which it is added. List Formatting enhancements can and often do differ page by page. The code consists of controls and web part. The presenters suggest you should use this web part responsibly!
Demo Presenters:
• David Warner (Catapult) | @DavidWarnerII
• Hugo Bernier (Point Alliance) | @bernierh
Supporting materials:
• Enhanced list formatting sample: https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-enhanced-list-formatting
• CSS Pseudo Elements: https://developer.mozilla.org/docs/Web/CSS/Pseudo-elements
• CSS Pseudo Classes: https://developer.mozilla.org/docs/Web/CSS/Pseudo-classes
• CSS Animations: https://developer.mozilla.org/docs/Web/CSS/animation
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 12-minute demo, David Warner and Hugo Bernier show off a SPFx Web Part used to put CSS styles on a single page. Capabilities demonstrated include banner formatting, hover effects, tilt list of photos, customize fonts, animations, sprites and more. Why not use an SPFx Extension for CSS? Extensions affect every page in a site collection whereas a web part affects only the pages on which it is added. List Formatting enhancements can and often do differ page by page. The code consists of controls and web part. The presenters suggest you should use this web part responsibly!
Demo Presenters:
• David Warner (Catapult) | @DavidWarnerII
• Hugo Bernier (Point Alliance) | @bernierh
Supporting materials:
• Enhanced list formatting sample: https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples/react-enhanced-list-formatting
• CSS Pseudo Elements: https://developer.mozilla.org/docs/Web/CSS/Pseudo-elements
• CSS Pseudo Classes: https://developer.mozilla.org/docs/Web/CSS/Pseudo-classes
• CSS Animations: https://developer.mozilla.org/docs/Web/CSS/animation
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 2 participants
- 12 minutes
5 Mar 2020
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on March 5, 2020.
Presently the Length operator does not return the number of characters of text in a selected list field. In this 10-minute demo, Chris Kent shares how to configure (trick) the IndexOf operator to return the length of a string in the field. Special thanks to Alberto Suárez Caballero http://albertosuarezcaballero.es/ for the “trick.”
Given this new capability, Chris suggests we can now easily add links to keywords in a list-based FAQ. Essentially, search text strings for keywords, for each keyword found, add link to additional information. Watch this demo and then get the “FAQ format” sample in the GitHub PnP sp-dev-list-formatting samples library.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• "FAQ format" sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/ (to be published soon)
• "Custom header format" sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-header-format
• Custom header demo | Chris Kent (DMI) | https://www.youtube.com/watch?v=4uQyYQp8G2I
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
Presently the Length operator does not return the number of characters of text in a selected list field. In this 10-minute demo, Chris Kent shares how to configure (trick) the IndexOf operator to return the length of a string in the field. Special thanks to Alberto Suárez Caballero http://albertosuarezcaballero.es/ for the “trick.”
Given this new capability, Chris suggests we can now easily add links to keywords in a list-based FAQ. Essentially, search text strings for keywords, for each keyword found, add link to additional information. Watch this demo and then get the “FAQ format” sample in the GitHub PnP sp-dev-list-formatting samples library.
Demo Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• "FAQ format" sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/ (to be published soon)
• "Custom header format" sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-header-format
• Custom header demo | Chris Kent (DMI) | https://www.youtube.com/watch?v=4uQyYQp8G2I
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 2 participants
- 10 minutes
20 Feb 2020
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on February 20, 2020.
In this 12-minute video, Chris Kent, adding to his previously delivered sessions on list formatting, demonstrates an extension to the baseline @rowIndex (Alternating Row formatting) available in a row formatting sample that allows the developer to not only select alternating rows, but also to hide existing column headings, to create independent row formatting, to add a custom header and to add icons and color fields based on position in the Row Index.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Alternating RowClass sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/alternating-rowclass
• Custom Header format sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-header-format
• Blogpost: bit.ly/LF-alternating
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 12-minute video, Chris Kent, adding to his previously delivered sessions on list formatting, demonstrates an extension to the baseline @rowIndex (Alternating Row formatting) available in a row formatting sample that allows the developer to not only select alternating rows, but also to hide existing column headings, to create independent row formatting, to add a custom header and to add icons and color fields based on position in the Row Index.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Alternating RowClass sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/alternating-rowclass
• Custom Header format sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/custom-header-format
• Blogpost: bit.ly/LF-alternating
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 2 participants
- 12 minutes
6 Feb 2020
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on February 6, 2020.
In this 11-minute video, Chris Kent, adding to his previously delivered sessions on list formatting, demonstrates using "IndexOf" and the "substring" operator to add an icon + summary status text to list column entries. This function is particularly useful when facing a long menu of choices and the options presented are a mash up of 2 or more thoughts. For example: Not Started: New, Not Started: Delayed, Not Started: Unassigned… Of course, you are free to use a bunch of "if" statements or calculated values for this conditional formatting task. Also, you are welcome to write your own json, but why not save time formatting your list by simply grabbing the generic Substring status json from the GitHub library of 80+ list formatting script samples available to you today?
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• SharePoint List Formatting Samples | https://sharepoint.github.io/sp-dev-list-formatting/
• Generic substring status formatting sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/generic-substring-status
• Doc Column formatting | http://aka.ms/spdev-column-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 11-minute video, Chris Kent, adding to his previously delivered sessions on list formatting, demonstrates using "IndexOf" and the "substring" operator to add an icon + summary status text to list column entries. This function is particularly useful when facing a long menu of choices and the options presented are a mash up of 2 or more thoughts. For example: Not Started: New, Not Started: Delayed, Not Started: Unassigned… Of course, you are free to use a bunch of "if" statements or calculated values for this conditional formatting task. Also, you are welcome to write your own json, but why not save time formatting your list by simply grabbing the generic Substring status json from the GitHub library of 80+ list formatting script samples available to you today?
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• SharePoint List Formatting Samples | https://sharepoint.github.io/sp-dev-list-formatting/
• Generic substring status formatting sample | https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/generic-substring-status
• Doc Column formatting | http://aka.ms/spdev-column-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 2 participants
- 11 minutes
4 Feb 2020
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on January 23, 2020.
In this 11-minute video, Chris Kent, Microsoft MVP and Office 365 Practice Lead at DMI, previews how a SharePoint list in a Microsoft Teams tab can be formatted in SharePoint from within the Teams tab. Note: This new formatting capability presently available only in the Teams Targeted Release, looks quite promising for SR. Formatting in SharePoint is fully supported in Teams with few exceptions. In the PnP list formatting repo on GitHub, there are 70 list column and view formatting code samples that one can simply copy and paste into the list’s column settings. Also shown in this demo was the addition of deep links - into chat, into tabs, into scheduling dialog, etc., in a list column.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Docs: https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/build-and-test/deep-links#deep-linking-to-a-chat
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-teams-chat-link
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-facepile
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 11-minute video, Chris Kent, Microsoft MVP and Office 365 Practice Lead at DMI, previews how a SharePoint list in a Microsoft Teams tab can be formatted in SharePoint from within the Teams tab. Note: This new formatting capability presently available only in the Teams Targeted Release, looks quite promising for SR. Formatting in SharePoint is fully supported in Teams with few exceptions. In the PnP list formatting repo on GitHub, there are 70 list column and view formatting code samples that one can simply copy and paste into the list’s column settings. Also shown in this demo was the addition of deep links - into chat, into tabs, into scheduling dialog, etc., in a list column.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• Docs: https://docs.microsoft.com/en-us/microsoftteams/platform/concepts/build-and-test/deep-links#deep-linking-to-a-chat
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-teams-chat-link
• Sample: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/multi-person-facepile
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 1 participant
- 11 minutes
9 Jan 2020
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on January 9, 2020.
In this 13-minute video, Chris Kent expands upon his previously delivered formatting demos to show using UI Fabric icons for list column and view formatting. List formatting tips for adding a Fabric icon to a field. Use conditional formatting statements to determine which icon/color to display based on information in fields of the column being and/or based on data in adjacent fields.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• List formatting samples: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/generic-icon-overlay
• UI Fabric Icons: https://uifabricicons.azurewebsites.net/
• Full documentation: https://aka.ms/spdev-column-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 13-minute video, Chris Kent expands upon his previously delivered formatting demos to show using UI Fabric icons for list column and view formatting. List formatting tips for adding a Fabric icon to a field. Use conditional formatting statements to determine which icon/color to display based on information in fields of the column being and/or based on data in adjacent fields.
Presenter: Chris Kent (DMI) | @theChrisKent
Supporting materials:
• List formatting samples: https://github.com/SharePoint/sp-dev-list-formatting/tree/master/column-samples/generic-icon-overlay
• UI Fabric Icons: https://uifabricicons.azurewebsites.net/
• Full documentation: https://aka.ms/spdev-column-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 1 participant
- 13 minutes
10 Dec 2019
This PnP community demo is taken from the monthly SharePoint Developer/Engineering update community call recorded on December 10, 2019.
In this 10-minute video, Chakkaradeep Chandran - Microsoft Program Manager for OneDrive & SharePoint, demonstrates using list conditional formatting and simple forms customization capabilities to organize the things your teams care about. Conditions are defined using Excel style formulas or expressions. These capabilities were recently announced at Microsoft Ignite 2019.
Presenter: Chakkaradeep Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Ignite 2019 session: SharePoint updates for teamwork: Sites, pages, lists, and libraries | http://aka.ms/MicrosoftIgnite2019/STR30
• Column and view formatting samples: http://aka.ms/list-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp
In this 10-minute video, Chakkaradeep Chandran - Microsoft Program Manager for OneDrive & SharePoint, demonstrates using list conditional formatting and simple forms customization capabilities to organize the things your teams care about. Conditions are defined using Excel style formulas or expressions. These capabilities were recently announced at Microsoft Ignite 2019.
Presenter: Chakkaradeep Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Ignite 2019 session: SharePoint updates for teamwork: Sites, pages, lists, and libraries | http://aka.ms/MicrosoftIgnite2019/STR30
• Column and view formatting samples: http://aka.ms/list-formatting
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp
- 1 participant
- 10 minutes
10 Dec 2019
This PnP community demo is taken from the monthly SharePoint Developer/Engineering update community call recorded on December 10, 2019.
In this 41-minute video, Chakkaradeep Chandran - Microsoft Program Manager for OneDrive & SharePoint, delivers an update on the continuum of business process solution capabilities built into and on-top-of SharePoint lists and libraries and that are built to draw from the entire Microsoft 365 stack from within SharePoint. This session includes demos focused on conditional formatting and on using Power apps for repeating tables. These capabilities were initially announced at Microsoft Ignite 2019 and have been updated since.
Presenter: Chakkaradeep Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Ignite 2019 session: Modernizing InfoPath forms with Power Apps | http://aka.ms/MicrosoftIgnite2019/BRK2294
• Microsoft Ignite 2019 session: SharePoint updates for teamwork: Sites, pages, lists, and libraries | http://aka.ms/MicrosoftIgnite2019/STR30
• Create InfoPath Repeating tables for SharePoint with PowerApps | https://www.petri.com/create-infopath-repeating-tables-sharepoint-powerapps | Shane Young | @ShanesCows
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp
In this 41-minute video, Chakkaradeep Chandran - Microsoft Program Manager for OneDrive & SharePoint, delivers an update on the continuum of business process solution capabilities built into and on-top-of SharePoint lists and libraries and that are built to draw from the entire Microsoft 365 stack from within SharePoint. This session includes demos focused on conditional formatting and on using Power apps for repeating tables. These capabilities were initially announced at Microsoft Ignite 2019 and have been updated since.
Presenter: Chakkaradeep Chandran (Microsoft) | @chakkaradeep
Supporting materials:
• Microsoft Ignite 2019 session: Modernizing InfoPath forms with Power Apps | http://aka.ms/MicrosoftIgnite2019/BRK2294
• Microsoft Ignite 2019 session: SharePoint updates for teamwork: Sites, pages, lists, and libraries | http://aka.ms/MicrosoftIgnite2019/STR30
• Create InfoPath Repeating tables for SharePoint with PowerApps | https://www.petri.com/create-infopath-repeating-tables-sharepoint-powerapps | Shane Young | @ShanesCows
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp
- 2 participants
- 41 minutes
28 Nov 2019
This PnP community demo is taken from the bi-weekly SharePoint Developer Community - General Development Special Interest Group (SIG) call recorded on November 28, 2019.
In this 8-minute video, Chris Kent show how to configure the List view web part and Embed web part to work together like an application that allows the user to select and display documents, photos, videos, etc., in the right pane of a web page.
Presenter: Chris Kent (DMI) | @theChrisKent
Open-source community samples around column and view formatting - https://sharepoint.github.io/sp-dev-list-formatting/
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
In this 8-minute video, Chris Kent show how to configure the List view web part and Embed web part to work together like an application that allows the user to select and display documents, photos, videos, etc., in the right pane of a web page.
Presenter: Chris Kent (DMI) | @theChrisKent
Open-source community samples around column and view formatting - https://sharepoint.github.io/sp-dev-list-formatting/
All SharePoint PnP Developer Community demos: https://www.youtube.com/playlist?list=PLR9nK3mnD-OWSbg0o9a7mx_E7s2u7h_o2
Learn more about the SharePoint developer community at: http://aka.ms/sppnp.
- 1 participant
- 8 minutes