Forum Discussion

Gnanavel06's avatar
Gnanavel06
Copper Contributor
Aug 31, 2025

How to hide Command bar in Sharepoint using SPFX Extension without CSS injection?

I know there are similar questions on the Internet. But none of it have the solution that I am looking for. I want to hide few action buttons (New, Edit in Grid View, Add shortcut to OneDrive, Pin to Quick Access, Share, etc.) in SharePoint Command bar using SPFX extensions. enter image description here

 

I know it can be achieved by injecting custom CSS with display: none property. But the problem is, in case in future if Microsoft updates the html element then this solution might break.

Another approach is to use JSON Formatting. But this needs to be done from SharePoint UI or by calling the SharePoint API to apply the JSON formatting. But I don't want to do this.

Initially my approach was: Access the command button like

const newCommand: Command = this.tryGetCommand("newComposite");
newCommand.visible = false
But I am getting undefined when I access it.

Is there any way to hide the command buttons from the code itself using SPFX extension.

No RepliesBe the first to reply

Resources