Lay-out lijsten opmaken zonder programmeerkennis.
Eindelijk! Het is haast ongelofelijk dat Microsoft tot op heden nog geen tool had voorzien om eigenschapsvelden in lijsten op te maken. Er bestonden wel al manieren om dit toch te doen, maar voor de gebruiker zonder enige of weinig kennis van programmeertaal was er niets. Tot nu! Of de methode die Microsoft heeft ontworpen ook efficiënt en gebruiksvriendelijk is hangt af van persoon tot persoon. Basiskennis van codeertalen is zeker een voordeel, al kan je zonder kennis ook de nodige instellingen doorvoeren.
In deze blog lees je meer over de werking, de mogelijkheden en enkele voorbeelden.
Voor meer voorbeelden en uitleg over de gebruikte code en hoe je ze kan aanpassen verwijs ik je door via deze link naar de uitleg van Microsoft zelf of probeer zelf met de column formatter.
Hoe werkt het?
Kort gezegd kopieer je de uitgeschreven code van het internet en pas je ze, indien nodig, aan naar jouw noden. Meer is het eigenlijk niet. De gekopieerde code is een JSON-object en vereist geen nieuwe lijnen. Het enige wat je moet veranderen is de kolominhoud waarop de column formatting zich moet baseren. Soms is dit de naam van het veld of een stijlaanpassing. Voor specifiekere lay-outaanpassingen is het wel aangeraden om iets of wat kennis te hebben van hoe je CSS moet schrijven. Zo heb je CSS nodig om bijvoorbeeld het lettertype te vergroten of de achtergrond in een bepaalde kleur te zetten. Info over CSS schrijven of zie voorbeeld onderaan deze blog.
Een greep uit het standaard aanbod van column formatting
Je kan gebruik maken van conditionele formattering, datavisualisatie, het toevoegen van knoppen en het wijzigen van getoonde velden. In de SharePointlijst hieronder zijn deze 4 types uitgewerkt.
Conditionele formattering: als de datum in het verleden ligt kleur de datum rood. Je kan dit ook instellen voor statusvelden e.d.
Datavisualisatie: via een databar wordt het verschil in aantal inschrijvingen getoond. De langste balk heeft de meeste inschrijvingen. Met een eenvoudig lijntje code kan je vlot de achtergrondkleur wijzigen. In mijn voorbeeld heb ik het standaardrood gewijzigd voor cyan.
Toevoegen van knoppen: bij de verantwoordelijke is een e-mailicoon toegevoegd dat de gebruiker toelaat de persoon onmiddellijk te mailen.
Wijzigen getoonde velden: als de activiteit heeft plaatsgevonden wordt er niet ‘yes’ of ‘no’ getoond, maar een vinkje.
Andere beschikbare mogelijkheden zijn:
- Hyperlink starten door op het veld te klikken
- Trends weergeven met pijltjes
- Flows starten via een button
- Velden kleur en icoon geven op basis van datum of status
- …
Customization
Microsoft heeft een tiental voorgedefinieerde scripts die je kan gebruiken in column formatting. Voor de doorwinterde developer biedt column formatting waarschijnlijk te weinig vrijheid, maar voor gewone gebruikers biedt deze oplossing wel degelijk mogelijkheden. Je kan zelf de tijd nemen om jouw lijstweergave op te maken zonder dat je daarvoor de hulp van een developer moet inroepen.
Je blijft wel gebonden aan wat Microsoft toelaat. Zo is het toevoegen van custom code immers niet mogelijk en ondersteunt column formatting niet alle veldtypes. Berekende velden, managed metadata en het bestandsnaamveld van een documentenbibliotheek kan je niet opmaken. De mogelijkheden die nu aangeboden worden, zijn al ruim voldoende om je weergave dat extra te geven zodat de eindgebruikers eenvoudiger hun informatie in de lijst kunnen vinden.
Zelf aan de slag
Een developer kiest zelf of hij al dan niet gebruikt maakt van column formatting. Heb je nauwelijks tot geen kennis hebt van programmeertalen is column formatting een handig hulpmiddel om jouw lijst de nodige meerwaarde te geven. Zoek online de code die je nodig hebt en pas ze aan naar jou vereisten. De online community stelt dagelijks nieuwe mogelijkheden ter beschikkingen: https://github.com/SharePoint/sp-dev-column-formatting
Voorbeeld met twee toegevoegde lay-outwijzigingen.
De code is gekopieerd van het internet. Om de standaard code toe te passen heb ik decorr ect naam van het veld ingegeven [$Datum]. Voor de extra opmaak heb ik 2 lijnen css toegevoegd: lettertypegrootte en achtergrondkleur. In SharePoint geeft dit dan het volgende resultaat:
|
