← 全部文章

教程

用 JustZix 改造 WordPress 后台(wp-admin)

18 5月 2026 · 作者 JustZix Team

WordPress 仪表盘很快就会变得杂乱:每个插件都塞进自己的通知、促销横幅或求好评提示,文章编辑器比它本可以的更窄,列表表格也很难扫读。这些你在设置里改不了——但你可以用一条限定到 /wp-admin/ 的 JustZix 规则叠加自己的 CSS 和 JS。下面是几个能让面板安静、易读的现成微调。

隐藏插件通知与求好评提示

wp-admin 里最大的噪音来源是 .notice——内容上方的横幅条。插件用它来填塞付费版的推销、求好评请求和更新提醒。WordPress 没有全局开关,所以我们用 CSS 把它们隐藏掉:

/* 隐藏促销横幅和插件求好评提示 */
#wpbody-content .notice,
#wpbody-content .updated,
#wpbody-content .update-nag,
#wpbody-content .notice-info,
.wp-pointer {
  display: none !important;
}

/* ……但保留真正的错误警告可见 */
#wpbody-content .notice-error,
#wpbody-content .notice-warning {
  display: block !important;
}

我们保留 .notice-error 和 .notice-warning,因为它们承载真正重要的消息——一次关键更新、一个数据库问题。促销噪音消失了,重要的东西留下了。

清理后台菜单

左侧菜单(#adminmenu)会随时间臃肿——一个插件,一个新条目。如果你从不使用某些区块,可以把它们隐藏。每个菜单条目都有一个稳定的 CSS id:

/* 隐藏你从不使用的菜单项 */
#adminmenu #menu-comments,
#adminmenu #menu-tools,
#adminmenu li#menu-dashboard ul li:nth-child(2) {
  display: none !important;
}

/* 更紧凑的菜单 = 内容有更多空间 */
#adminmenu .wp-menu-name {
  font-size: 13px;
}

在 DevTools 里找到条目 id——悬停在 #adminmenu 内的 <li> 元素上,读取它的 id(例如 menu-plugins、menu-users)。

更宽的编辑器与粘性的“发布”框

在经典编辑器里,内容栏比它需要的更窄。以元数据框栏为代价把它加宽,并固定发布面板,让 发布 按钮始终触手可及:

/* 经典编辑器里更宽的内容栏 */
#post-body-content {
  margin-right: 300px;
}
#postbox-container-1 {
  width: 280px;
}

/* 粘性的“发布”框 */
#postbox-container-1 #submitdiv {
  position: sticky;
  top: 50px;
  z-index: 10;
}

易读的列表表格

文章、页面和评论表格(.wp-list-table)相当松散。把它们收紧并高亮行,让你的视线不会迷失:

/* 更密、更易读的列表表格 */
.wp-list-table td,
.wp-list-table th {
  padding-top: 6px !important;
  padding-bottom: 6px !important;
}
.wp-list-table tbody tr:hover {
  background: #f0f6fc !important;
}
.wp-list-table .check-column {
  width: 2.2em !important;
}

更暗、更平静的后台

如果你晚上在 wp-admin 里工作,明亮的背景很累眼。WordPress 有配色方案,但它们覆盖不了整个面板。一层轻量的 CSS 把内容背景调暗:

/* 略微调暗的后台背景 */
#wpbody-content,
.wrap {
  background: #1e1e1e !important;
  color: #e4e4e4 !important;
}
#wpbody-content .wp-list-table {
  background: #2a2a2a !important;
}
#wpbody-content a {
  color: #6cb6ff !important;
}

这是一个简化版的深色模式——完整的还需要在表单字段上下功夫。把它保留为单独的规则,晚上从操作栏一键打开。

隐藏“帮助”、“显示选项”与 Gutenberg 微调

顶部的 帮助 和 显示选项 标签很少用到。而在块编辑器里,值得把写作区域加宽:

// 隐藏“帮助”/“显示选项”标签(JS,document_idle)
['#contextual-help-link-wrap', '#screen-options-link-wrap']
  .forEach(sel => {
    const el = document.querySelector(sel);
    if (el) el.style.display = 'none';
  });

// Gutenberg:更宽的内容区域
const css = document.createElement('style');
css.textContent =
  '.editor-styles-wrapper .wp-block { max-width: 900px; }';
document.head.appendChild(css);

搭建你自己的一套

把每个微调保留为单独的、命名的规则——“wp-admin:无通知”“wp-admin:更宽编辑器”“wp-admin:深色”——每个都固定到 */wp-admin/* 模式。然后几秒钟你就能让面板贴合任务:早上一个干净的仪表盘,晚上深色模式。

WordPress 后台的现成规则在目录里——看看 wp-admin 的示例,复制适合你的。安装 JustZix,今天就清理你的仪表盘。