【插件评测】Cora——最好的免费WordPress后台主题
2021年更新
在2021年3月，作者主动下载这款插件。本文已过时。WordPress受欢迎的原因有很多，但我不认为后台管理界面是其中之一。 是，它的功能足够强大，但它的界面（至少在我看来）设计并不那么高效和友好。 Cora是对WordPress后台的一次完全重新设计，带来了更加简洁和现代的设计，并且增添了一些实用的小功能。 如果你在为你的客户建造网站，Cora可以帮助你为客户提供更好的体验；如果你在自己的网站上工作，它也能为你提供一个更舒适、更高效的后台使用体验。
插件特点
- 重新设计的后台外观，更加现代和简洁；
- 提供一些白标功能，可用来“隐藏WordPress痕迹”；
- 增加自定义脚本/样式；
- 提供一些优化开关等。
它的功能
免费版的Cora可为您提供：- 白标(White Label)功能，比如：
- 重新排序左侧菜单项的顺序，并添加网站Logo；
- 去除顶部工具栏原有的菜单项（包括WordPress Logo），或者增添自己的菜单项；
- 修改页脚的“感谢使用WordPress进行创作”文字；
- 增加自定义脚本/样式（可在后台、前台或登录页生效）；
- 一些优化开关。
- 自定义后台主题（亮色/暗色主题、更轻松的自定义各处颜色等）；
- 自定义登录页面（与后台风格保持统一）。
上手体验
在安装Cora之后，就能立刻看到全新设计的后台，整体感受令人耳目一新：整体色调更加柔和、恰到好处的阴影、更多的留白，使得整个WordPress后台看起更有2020年该有的感觉。 （图：安装Cora前的后台界面） （图：安装Cora后的后台界面，有很明显的改变） 再回过头来看原版的后台界面，就显得原版的后台界面比较粗糙了。详细设置
点击左侧菜单中的“Cora”即可进入设置界面，在此我将挑几个我感兴趣的几个功能进行讲解：自定义左侧菜单和管理工具栏里的栏目
在“Menu”部分里可以重新排布左侧菜单的顺序（可能不好使）。点击其中一项里的“Remove”按钮可以删除对应的菜单项。 在“Menu”部分和“Toolbar”部分均有“Add Item”按钮，点击它即可添加自定义的菜单项，可以设置菜单项名称、图标、地址、对谁隐藏等。 （图：Menu部分）页脚设置
在“General”部分里，可以设置“感谢使用WordPress进行创作”所在位置的文字，还可以显示网站服务器的信息（包括内存使用量、PHP版本、操作系统等信息）。 （图：General部分）优化
在“Optimization”部分里，可以将不需要使用的功能关上，加快网站速度。可以开关的功能有：- WP Version Meta-Tag
- WP Emoji
- RSS Feed
- WP oEmbed
- 等诸多功能。
缺点
美中不足的是，默认情况下，左侧菜单的文字颜色和背景颜色十分相近，可读性不佳。不过可以通过自定义CSS修复。 （图：左侧菜单） 并且，如果你在使用经典编辑器的话，编辑器的工具栏会距离页面顶部一定空间，露出后面的文字。这个不太好解决。 （图：编辑器顶部）结束语
总的来说，我喜欢Cora。我可以自信地说，截至2020年7月，这是我个人使用的最好的免费的WordPress后台主题。额外内容
免费版Cora也能自定义外观
点击左侧菜单中的“Cora”，然后点击“Custom Scripts”，然后点击“Admin Scripts”中的“Add Item”按钮，依次输入：- Title：Admin Customize
- Type：CSS
- Code：复制以下内容。
:root {
/******** 基础颜色设置，可随意修改 ********/
/* ·整个页面的背景颜色 */
--primary_background_color: #f4f5ff;
/* ◆主要元素（面板等）的背景颜色 */
--secondary_background_color: #fff;
/* ◆主要按钮背景颜色（如“发布”按钮） */
--primary_button_color: #02b875;
/* ·主要按钮文字颜色（若按钮颜色太浅，请修改这里） */
--primary_button_text: #fff;
/* ◆次要按钮背景颜色（如“写文章”按钮） */
--secondary_button_color: rgba(0,0,0,0.065);
/* ·次要按钮文字颜色（若按钮颜色太浅，请修改这里） */
--secondary_button_text: #778194;
/* ◆主要文字颜色（影响大部分文字） */
--primary_text_color: #848490;
/* ·次要文字颜色（影响文本框等地方） */
--secondary_text_color: #778194;
/* ◇链接颜色（使用按钮颜色，若按钮颜色太浅，可修改这里） */
--link_color: var(--primary_button_color);
/******** 接下来为高级颜色设置，可酌情修改 ********/
/* ◆左侧菜单背景颜色 */
--menu_background: #3f4655;
/* ◇左侧菜单文字颜色 */
--menu_item_text: hsla(0,0%,100%,0.8);
/* ·左侧菜单文字高亮颜色（应比上一个亮） */
--menu_highlight_text: hsla(0,0%,100%,0.9);
/* ·左侧菜单背景高亮颜色 */
--menu_highlight_background: var(--primary_button_color);
/* ◆子菜单背景颜色（影响左侧菜单和工具栏中的子菜单） */
--menu_submenu_background: #3f4655;
/* ◇子菜单文字颜色 */
--menu_submenu_item_text: hsla(0,0%,100%,0.7);
/* ·子菜单文字高亮颜色（应比上一个亮） */
--menu_submenu_highlight_text: hsla(0,0%,100%,0.8);
/* ·左侧菜单Logo文字颜色 */
--menu_logo_text: hsla(0,0%,100%,0.9);
/* ◇管理工具栏背景颜色 */
--toolbar_background: hsla(0,0%,100%,0);
/* ·管理工具栏文字颜色 */
--toolbar_item_text: #878b9a;
/* ◇管理工具栏文字高亮颜色 */
--toolbar_highlight_text: #fff;
/* ◆管理工具栏背景高亮颜色 */
--toolbar_highlight_background: #5b606b;
/* ◇表单元素（如文本框等）背景颜色 */
--forms_field_background: rgba(0,0,0,0.065);
/* ·表单元素边框颜色 */
--forms_field_border: transparent;
/******** 接下来为其他设置 ********/
/* 左侧菜单宽度 */
--menu_width: 210px;
/* 收起后左侧菜单宽度 */
--menu_folded_width: 55px;
}
/******** ！若遇到左侧菜单布局错乱，请去掉这个样式！ ********/
body:not(.folded) #adminmenumain li.menu-top { float: none; }
/******** 以下为我写好的必要的调整，不需要动 ********/
@media screen and (max-width:782px) {
/* 缩减移动端四周的留白 */
.auto-fold #wpcontent {
padding: 60px 10px!important;
}
}
/* 缩减过长的菜单项文字，否则会导致溢出 */
body:not(.folded) #adminmenumain div.wp-menu-name {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
/* 同步颜色 */
#adminmenu a:hover,
#adminmenu li.menu-top:hover,
#adminmenu li.opensub>a.menu-top,
#adminmenu li>a.menu-top:focus {
background-color: var(--menu_highlight_background);
}
a:active, a:focus, a:hover {
color:var(--link_color);
opacity:0.85;
}
.wrap>.subsubsub li a {
font-size: 14px;
}
.wrap>.subsubsub li {
margin-bottom: 8px;
}
/* 插入媒体界面 */
.media-menu {
background: var(--primary_background_color);
}
.media-frame-content, .media-modal-content {
background: var(--secondary_background_color);
}
/* 主题页面 */
.theme-browser .theme .theme-actions {
background: var(--primary_background_color);
}
.theme-browser .theme .theme-actions,.theme-browser .theme.active .theme-actions, .theme-browser .theme.active .theme-name {
background: var(--secondary_button_color);
}
.theme-browser .theme.active .theme-name, .theme-browser .theme.add-new-theme a:focus:after, .theme-browser .theme.add-new-theme a:hover:after {
background: var(--primary_button_color);
}
.theme-browser .theme.add-new-theme a:focus span:after, .theme-browser .theme.add-new-theme a:hover span:after {
color: var(--primary_button_color);
}/* 字体 */
#collapse-button, .cora-branding, body:not(.folded) #adminmenumain div.wp-menu-name, body:not(.auto-fold):not(.folded) #adminmenumain div.wp-menu-name, #adminmenumain div.wp-menu-name, body.login h1, .wrap h1 {
font-family: sans-serif;
}
body:not(.folded) #adminmenumain div.wp-menu-name {
line-height: 2;
}
.post-title:active, .post-title:focus, .post-title-placeholder:active, .post-title-placeholder:focus {
border-color: var(--primary_button_color);
box-shadow: inset 0px -3px 0 var(--primary_button_color);
}
.adminbar {
height: 53px;
box-sizing: border-box;
background: var(--menu_background)!important;
color: var(--toolbar_item_text);
}
.current-site-name {
color: var(--menu_item_text);
}
.press-this-actions {
background: var(--forms_field_background);
}
然后直接按左下角的“Save Changes”按钮即可。
禁用Cora的某个功能
好在Cora拥有“模块化设计”，您可以单独开关某一种功能。 进入网站的FTP（文件管理），打开（网站根目录）/wp-content/plugins/cora-lite/cora.php文件，滚动到第160行左右。
接下来，找到“$modules = ['menu', 'toolbar'……”这里，去掉你不想加载的模块。
比如，如果您不想要重新排序左侧菜单，则可以去掉“menu”模块。
各个模块的作用如下：
'menu'——菜单重排序、网站Logo设置'toolbar'——顶部管理工具栏相关设置'theme'——（占位符，可放心去掉）更改主题'login'——（占位符，可放心去掉）更改登录页面'general'——白标功能'scripts'——自定义脚本'optimization'——优化'advanced'——导入/导出插件设置