SharePoint Document Issues

How to Remove the Edit Link from a Modern SharePoint Navigation Bar

Nimra Malik Oct 20, 2026 869 views

Question details

The user wants to hide the 'Edit' link on a modern SharePoint site's navigation bar without removing users from the associated Microsoft Team.

How to Remove the Edit Link from a Modern SharePoint Navigation Bar

Product: Microsoft SharePoint
Device & OS: not provided
Scenario: Managing a modern SharePoint site connected to Microsoft Teams where users need Teams access but should not be allowed to edit the SharePoint navigation.
Observed behavior: Standard SharePoint permission changes, such as moving users to Visitors, successfully hide the Edit link but undesirably remove users from the associated Microsoft Team.

Before you start

Ensure you have Site Admin privileges in SharePoint and understand that modifying standard permissions for a Teams-connected site will natively impact Microsoft Teams membership.

Solution 1Recommended

Use SharePoint Framework (SPFx) for Interface Customization

The safest way to hide the Edit link without affecting Microsoft Teams membership is by deploying a custom SPFx Application Customizer to inject CSS.

Modern SharePoint connected to Teams tightly integrates permissions. Because standard permission adjustments alter Team membership, a programmatic approach is required to hide UI elements while maintaining the underlying group access.

Set up your development environment

Install Node.js, Yeoman, and the SharePoint Framework generator on your local machine to prepare for SPFx development.

Create an SPFx extension

Run the Yeoman generator to create a new SPFx project and select 'Application Customizer' as your extension type.

Inject custom CSS

Write code within the extension to target the navigation bar's Edit link DOM element (using its CSS class) and apply a 'display: none;' rule to hide it from users.

Deploy the solution

Package the solution using gulp tasks, upload it to your tenant's SharePoint App Catalog, and deploy the application to the specific modern site.

Use SharePoint Framework (SPFx) for Interface Customization

Customization Maintenance: DOM manipulation is not officially supported by Microsoft. Always test your customization after SharePoint updates, as structural changes to the UI may require you to update your CSS selectors.

Solution 2

Adjust SharePoint Permissions (If Teams Access is Flexible)

If you do not strictly require users to maintain their edit access in the associated Microsoft Team, you can resolve this through standard permission settings.

Free Microsoft Office alternative

Work Seamlessly with WPS Office

While managing SharePoint and Teams integration requires complex SPFx development for simple UI changes, creating and editing your daily documents shouldn't be complicated. WPS Office provides a lightweight, free alternative to Microsoft Office, ensuring you can manage your files efficiently without a steep learning curve.

1. Download WPS Office: Visit the official WPS Office website and download the free installer for your operating system.
2. Install the Application: Run the installer and follow the quick setup wizard to install the suite on your device.
3. Open and Edit Seamlessly: Open your existing Word, Excel, and PowerPoint documents directly in WPS Office with full formatting preserved.

Fully compatible with Microsoft Office formats (.docx, .xlsx, .pptx)Completely free and lightweight office suiteFamiliar user interface for a seamless, zero-learning-curve migrationBuilt-in powerful PDF editing and conversion tools

microsoft office alternative - wps office

Frequently Asked Questions

Why does changing a user to 'Visitor' remove them from Microsoft Teams?

Modern SharePoint sites connected to Microsoft Teams use Microsoft 365 Groups to manage membership. Changing a user to a Visitor in SharePoint automatically removes them from the underlying M365 Member group, which consequently revokes their access to the associated Microsoft Team.

Can I use standard CSS in site settings to hide the Edit link?

No. Modern SharePoint pages do not allow you to inject raw CSS or script tags directly through the standard user interface or master pages. You must use the SharePoint Framework (SPFx) to securely deploy a custom extension.

Where can I get help writing the SPFx code for this customization?

You can seek developer assistance and find community-shared code snippets on Microsoft Q&A by posting your questions using the 'sharepoint-dev' and 'office-sharepoint-online' tags.

Document & File Issues