Modify SharePoint Online Toolbar Buttons with JSON
In this post we explain how to modify the standard toolbar buttons (New, Edit, Share, etc.) in SharePoint or Microsoft Lists and Libraries. Thanks to the new SharePoint List Formatting capabilities, this is now possible! JSON (JavaScript Object Notation) allows us to customize the text of these buttons, hide them completely, or move them to the overflow area.
This functionality provides the flexibility to truly customize our lists and offers the additional benefit of hiding specific elements when SharePoint lists serve as a backend for Power Apps canvas applications. By hiding the New and Edit buttons, users will be directed to your Power App instead of attempting to bypass it directly within the list.
Navigate to “Format current view”
Press Advanced mode
Now its possible to input the JSON code.
An example of the JSON code used in a project is listed below.
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
"commandBarProps": {
"commands": [
{
"key": "automate",
"position": 5,
"sectionType": "Primary"
},
{
"key": "properties",
"position": 1,
"sectionType": "Primary"
},
{
"key": "checkIn",
"position": 2,
"sectionType": "Primary"
},
{
"key": "checkOut",
"position": 3,
"sectionType": "Primary"
},
{
"key": "undoCheckOut",
"position": 4,
"sectionType": "Primary"
},
{
"key": "editInGridView",
"hide": true
},
{
"key": "new",
"hide": true
},
{
"key": "sync",
"hide": true
},
{
"key": "share",
"hide": true
},
{
"key": "copyLink",
"hide": true
},
{
"key": "pinToQuickAccess",
"hide": true
},
{
"key": "open",
"hide": true
},
{
"key": "pinItem",
"hide": true
},
{
"key": "newFolder",
"hide": true
},
{
"key": "uploadFolder",
"hide": true
},
{
"key": "uploadTemplate",
"hide": true
},
{
"key": "addTemplate",
"hide": true
},
{
"key": "upload",
"hide": true
},
{
"key": "checkOut",
"hide": true
},
{
"key": "checkIn",
"hide": true
},
{
"key": "undoCheckOut",
"hide": true
},
{
"key": "download",
"hide": true
},
{
"key": "addShortcut",
"hide": true
}
]
}
}
All keys you can use are listed below
‘new’
‘newFolder’
‘newWordDocument’
‘newExcelWorkbook’
‘newPowerPointPresentation’
‘newOneNoteNotebook’
‘newFormsForExcel’
‘newVisioDrawing’
‘upload’
‘uploadFile’
‘uploadFolder’
‘open’
‘share’
‘copyLink’
‘download’
‘rename’
‘copyTo’
‘moveTo’
‘delete’
‘edit’
‘comment’
‘editNewMenu’
‘powerBI’
‘powerBIVisualizeList’
‘automate’
‘automateCreateRule’
‘automateManageRules’
‘powerAutomate’
‘powerAutomateCreateFlow’
‘powerAutomateSeeFlows’
‘powerAutomateConfigureFlows’
‘aiBuilderCreate’
‘aiBuilderGoto’
‘aiBuilder’
‘alertMe’
‘newLink’
‘integrate’
‘manageAlert’
‘powerApps’
‘powerAppsCreateApp’
‘powerAppsSeeAllApps’
‘powerAppsCustomizeForms’
‘viewDocumentUnderstandingModels’
‘versionHistory’
‘openInImmersiveReader’
‘classifyAndExtract’
‘checkOut’
‘checkIn’
‘undoCheckOut’
‘properties’
‘pinItem’
‘exportExcel’
‘exportCSV’
‘export’
‘editInGridView’
‘exitGridView’
‘sync’
‘uploadTemplate’
‘addTemplate’
‘openInOfficeOnline’
‘openInOfficeClient’
‘addShortcut’
‘pinToQuickAccess’
‘unpinFromQuickAccess’