Give the WordPress sidebar the width it actually needs
Custom Menu Width resizes the admin sidebar to fit long labels or a translated interface, and automatically repositions any third-party panel still expecting WordPress's hardcoded 160px.
- One width value, in px, em, rem or %.
- Applies only above WordPress's own 961px collapse breakpoint.
- Detects and repositions elements hardcoded to the old 160px width.
- Fixes a real stacking bug that can make the sidebar look broken.
What does Custom Menu Width do?
When the admin_menu_width module is active, TOWP_Admin_Menu_Width injects a stylesheet on admin_head that resizes the sidebar, its submenu panels and the content area's margin to a chosen width, scoped inside a min-width: 961px media query so WordPress's own responsive collapse and mobile layout still take over below that. Because WordPress has no CSS variable or hook for the sidebar's width, other plugins commonly hardcode its default 160px into their own fixed-position panels; a companion script enqueued through admin_enqueue_scripts detects any element whose left edge lands exactly on that number and repositions it to match the new width, using a MutationObserver to catch panels, like Query Monitor's, that get built by script well after the page loads.
WordPress's sidebar width is fixed for one language
A width tuned for one language and a handful of core menu items rarely matches what a real, plugin-heavy, translated install actually needs.
Long labels wrap onto two lines
The default width was sized for English menu labels of ordinary length; a translated site, or one where plugins have added entries with longer names, ends up with labels wrapping awkwardly.
A fixed width doesn't fit every screen
On a smaller screen, a sidebar that's wider than it needs to be takes working space that's hard to justify; on a larger one, the same width can feel cramped.
One width, applied everywhere it needs to be
The module doesn't just widen the sidebar; it also finds and fixes everything else that assumed the sidebar would stay at its default size.
A single width, four units
Set the sidebar's width in px, em, rem or % from one field, applied consistently across the menu, its submenus and the content area.
Other plugins compensated automatically
A heuristic script finds fixed-position panels still anchored to WordPress's hardcoded 160px and moves them to match the new width, without a list of plugin names to maintain.
A genuine stacking bug fixed
The sidebar's background and its items sit at very different stacking levels in WordPress core; the module aligns them so a third-party panel can no longer render sandwiched between the two.
A resize that brings everything else with it
Every capability below is present in the supplied PHP class, its compensation script and settings registration.
One width, four units
px, em, rem or % apply to the sidebar, its submenu panels, and the content area's margin, all from a single value.
Only above 961px
The custom width sits inside a min-width: 961px media query, so WordPress's own icon-only collapse and mobile layout still work exactly as before.
Detects, not a plugin list
A script looks for any fixed or absolute element whose left edge sits exactly on WordPress's hardcoded 160px, rather than checking against a maintained list of plugin names.
A MutationObserver watches for new elements
Panels built by script well after page load, like Query Monitor's, still get detected and repositioned correctly.
Aligns two mismatched z-index levels
WordPress renders the sidebar's background and its items at very different stacking levels; the module raises the background so nothing can render caught between them.
Query Monitor and Freemius, by name
Two specific, widely-installed integrations get an explicit CSS fix in addition to the general JS detection, since both anchor fixed elements to the old 160px.
Where a wider sidebar helps most
The module supports the situations where WordPress's default width was never really tuned for.
Translated or localized sites
Widen the sidebar so translated menu labels, often longer than their English originals, display on a single line.
Sites with many plugin-added menu items
Accommodate the longer labels that accumulate as more plugins each add their own top-level or submenu entry.
Smaller or larger screens
Narrow the sidebar to reclaim working space on a smaller display, or widen it comfortably on a large monitor.
A wider sidebar without collateral damage
The module combines resizing, universal compatibility and a real bug fix in one setting.
Bounded checks, nothing when unset
The verified implementation keeps the compensation script's work fast and scoped.
No effect below the default width
If the width value isn't set, or is zero or invalid, neither the CSS nor the compensation script gets added at all.
The compensation script only scans nearby elements
The detection walks three levels below <body>, not the entire page, keeping each sweep fast.
Deliberately throttled rechecks
The script rechecks shortly after load and again once contents settle, rather than running continuously, keeping overhead bounded.
Validated input, layout-only script access
The code validates the width before use and keeps the compensation script strictly to positioning.
Value and unit are both validated
The width has to pass is_numeric() and be greater than zero, and the unit gets checked against a fixed list of four options.
Output is escaped
The generated width value passes through esc_attr() before being placed into the inline stylesheet.
The compensation script only touches layout properties
It sets left, right and width with inline styles; it never touches content, attributes, or anything beyond positioning.
Administrator-only configuration
Only an administrator with access to TheOneWP settings can change the sidebar's width.
Built to work around WordPress's blind spot
The supplied code integrates through APIs present in WordPress core. No compatibility claim beyond the verified implementation is assumed.
Respects WordPress's own breakpoints
The custom width only applies above 961px, leaving WordPress's native auto-fold and mobile layouts untouched below that.
Detected by position, not by name
Any fixed or absolute element whose left edge matches WordPress's hardcoded 160px gets repositioned, covering plugins the module has never specifically been told about.
Query Monitor and Freemius
Both get a dedicated CSS rule in addition to the general script, since they're widely installed and anchor fixed panels to the old width.
TheOneWP versus common alternatives
Compare the verified Custom Menu Width implementation with a typical hand-written admin CSS snippet.
| Capability | TheOneWP Custom Menu Width | Other common solutions |
|---|---|---|
| Resizing the sidebar | One field, four units, applied consistently | Usually requires a custom admin CSS snippet |
| Third-party plugin panels | Detected automatically by position, no list needed | A CSS snippet only fixes the plugins someone thought to name |
| Responsive behaviour | WordPress's own collapse and mobile layout stay intact | A blanket width override can break the native mobile menu |
| The sidebar stacking bug | Fixed as part of the same module | Not something a simple width override typically addresses |
| Administration | One field inside TheOneWP settings | Requires editing a child theme's CSS file directly |
Resize the sidebar in four steps
Size around the longest label the menu actually has to display.
Enable Custom Menu Width
Activate the module from the TheOneWP Backend settings tab.
Set a width and unit
Enter a value and choose px, em, rem or %, based on whether labels are wrapping or the sidebar simply feels too narrow or too wide.
Check the sidebar and any third-party panels
Reload an admin screen and look at any developer tools or notice panels from other plugins to confirm they still align correctly.
Adjust or reset as needed
Fine-tune the value, or use Reset to return to WordPress's own default width.
Resize with the longest label in mind
A good sidebar width is set around what the menu actually needs to display, not a round number.
Widen enough to fit the longest label
Check the menu item with the longest label, often from a translated string or a plugin's own naming, and size around that.
Test on the smallest supported screen
A width that looks fine on a large monitor might feel cramped for content on a smaller one, so check both.
Give a third-party panel a moment to settle
A newly opened panel like Query Monitor's may reposition itself a moment after appearing, which is the compensation script catching up, not a bug.
Reset if a specific panel still looks wrong
If some other fixed element still doesn't align after resizing, that panel likely isn't anchored to the standard 160px in the way the detection expects.
Avoid assumptions that cause confusion
The module's detection logic and responsive scope are both deliberate and worth understanding.
Assuming every plugin panel gets fixed automatically
The detection targets elements whose left edge sits exactly on WordPress's hardcoded 160px; a panel positioned differently won't match that specific pattern.
Expecting the custom width on small screens
The setting only applies above 961px by design, so WordPress's own collapsed and mobile layouts look exactly as they did before below that.
Setting an extreme width value
A very wide or very narrow sidebar can make the admin harder to use rather than easier, even though the labels display cleanly.
Custom Menu Width FAQ
These answers come directly from the verified class, its compensation script and settings registration.
What does Custom Menu Width do?
It resizes the WordPress admin sidebar to a chosen width, in px, em, rem or %, and automatically repositions other plugins' fixed-position panels that assumed the sidebar would stay at its default 160px.
Why would I need to widen the sidebar?
Usually because menu labels are wrapping onto two lines, often on a translated site or one where several plugins have added entries with longer names.
Does this break WordPress's mobile or collapsed sidebar?
No. The custom width only applies above a 961px viewport, so WordPress's own icon-only collapse and mobile layout work exactly as they did before.
How does the module know which other plugins to fix?
It doesn't rely on a list of plugin names. A script detects any fixed or absolute element whose left edge sits exactly on WordPress's hardcoded 160px and repositions it to match.
Does the compensation work for panels that load after the page, like Query Monitor's?
Yes. A MutationObserver watches for newly added elements, so panels built by script well after load still get detected and repositioned.
What's the stacking bug this module fixes?
WordPress renders the sidebar's background and its items at very different z-index levels; a third-party panel with a z-index between the two can render sandwiched inside the sidebar. The module aligns the levels to prevent that.
Are any specific plugins handled explicitly?
Yes. Query Monitor and Freemius both get a dedicated CSS fix in addition to the general detection script, since they're widely installed.
What happens if I don't set a width value?
Nothing changes. Without a valid, positive value, neither the CSS nor the compensation script gets added to the page.
Can I undo a width change?
Yes, using the field's Reset button, which returns the value to WordPress's own default.
Does this affect the front end of the site?
No. Both the CSS and the compensation script only run inside wp-admin.
Stop watching menu labels wrap onto two lines.Give the sidebar the width it needs.
Use Custom Menu Width to resize the admin sidebar and automatically keep other plugins' panels aligned with it.