How to Hide the Left Sidebar on a Single Modern SharePoint Page
Question details
The user wants to remove or hide the left-hand navigation pane (Quick Launch) on a specific modern SharePoint page without affecting the navigation across the entire site.
- Product
- Microsoft SharePoint
- Device & OS
- not provided
- Scenario
- Customizing the layout of a single modern SharePoint page to maximize screen space by removing the left navigation sidebar.
- Observed behavior
- Modern SharePoint does not offer built-in settings to hide the Quick Launch navigation on a per-page basis, and modifying the layout with custom CSS is officially unsupported.
Check with your SharePoint administrator to ensure you have the necessary permissions to deploy custom SharePoint Framework (SPFx) web parts, as out-of-the-box settings only allow hiding the navigation for the entire site.
Use a Custom SPFx Web Part (Modern Script Editor)
Since custom CSS is unsupported natively, deploying a third-party SPFx web part like the Modern Script Editor allows you to inject CSS into a specific page.
Modern SharePoint pages do not natively support adding code snippet web parts like the classic Script Editor. However, open-source developers have created a modern equivalent using the SharePoint Framework (SPFx).
Note that Microsoft does not officially support custom CSS injection, and future layout updates by Microsoft may break your custom code on production sites.
Download a modern SPFx Script Editor web part package from a reputable GitHub repository (such as the PnP SPFx web parts collection).
Upload and deploy the app package (.sppkg) to your organization's SharePoint App Catalog. This step requires SharePoint Administrator privileges.
Navigate to the specific modern page where you want to hide the sidebar and click 'Edit' in the top right corner of the screen.
Add the newly deployed Modern Script Editor web part to the page and insert the necessary CSS code to target and hide the left navigation DOM element.
Disable Quick Launch for the Entire Site
If hiding the sidebar on a single page is not strictly required, you can reliably disable the left navigation globally for the entire site using native settings.
Enhance Your Daily Productivity with WPS Office
While SharePoint handles your team's intranet and web pages, you still need a robust desktop suite for creating documents, spreadsheets, and presentations. WPS Office offers a free, lightweight, and highly compatible alternative to Microsoft Office, perfectly matching your document management needs.
- 1. Download and install: Get the official WPS Office installer from the website and complete the quick installation process.
- 2. Set as default: Easily set WPS Office as your default application to handle all your standard document formats.
- 3. Work seamlessly: Open, edit, and save your existing Microsoft Office files without worrying about formatting issues.
Frequently Asked Questions
Why doesn't the classic Script Editor web part work on modern SharePoint pages?
Microsoft redesigned modern pages for responsiveness and security. Native script injection was disabled to prevent arbitrary code execution and to ensure page layouts remain intact across different devices and updates.
Can I use PowerShell to hide the left sidebar on a specific page?
No. PowerShell can only modify site-level or web-level features, such as disabling the Quick Launch entirely. It cannot target and hide the navigation on an individual modern page.
Is there any official way to hide the left navigation on just one page?
Currently, Microsoft does not provide an out-of-the-box configuration to hide the left navigation on a per-page basis for Team sites. Creating a 'Communication Site' removes the left navigation globally, but individual page toggles do not exist.
