修改WordPress后台的字体为微软雅黑

mengkun 1,270 2

由于众所周知的原因,WordPress后台的字体还是千年不变的宋体,简直非常难看!本文教你如何将后台字体改为微软雅黑(当然也可以是其它你喜欢的字体)……

题外话:我发现最近真是越来越喜欢微软雅黑字体呢~ :)

先来一张效果图!

修改WordPress后台的字体为微软雅黑

我们点击后台左侧的“外观”,选择“编辑”,然后在右侧找到“模板函数 function.php”,在里面添加如下代码并保存即可。

  1. // 更改后台字体
  2. function Bing_admin_lettering(){
  3.     echo'<style type="text/css">
  4.         * { font-family: "Microsoft YaHei" !important; }
  5.         i, .ab-icon, .mce-close, i.mce-i-aligncenter, i.mce-i-alignjustify, i.mce-i-alignleft, i.mce-i-alignright, i.mce-i-blockquote, i.mce-i-bold, i.mce-i-bullist, i.mce-i-charmap, i.mce-i-forecolor, i.mce-i-fullscreen, i.mce-i-help, i.mce-i-hr, i.mce-i-indent, i.mce-i-italic, i.mce-i-link, i.mce-i-ltr, i.mce-i-numlist, i.mce-i-outdent, i.mce-i-pastetext, i.mce-i-pasteword, i.mce-i-redo, i.mce-i-removeformat, i.mce-i-spellchecker, i.mce-i-strikethrough, i.mce-i-underline, i.mce-i-undo, i.mce-i-unlink, i.mce-i-wp-media-library, i.mce-i-wp_adv, i.mce-i-wp_fullscreen, i.mce-i-wp_help, i.mce-i-wp_more, i.mce-i-wp_page, .qt-fullscreen, .star-rating .star { font-family: dashicons !important; }
  6.         .mce-ico { font-family: tinymce, Arial !important; }
  7.         .fa { font-family: FontAwesome !important; }
  8.         .genericon { font-family: "Genericons" !important; }
  9.         .appearance_page_scte-theme-editor #wpbody *, .ace_editor * { font-family: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace !important; }
  10.         .post-type-post #advanced-sortables, .post-type-post #autopaging .description { display: none !important; }
  11.         .form-field input, .form-field textarea { width: inherit; border-width: 0; }
  12.         </style>';
  13. }
  14. add_action('admin_head', 'Bing_admin_lettering');

 

修改WordPress后台的字体为微软雅黑

2016-12-6更新

上述代码是从网上找来的,经过测试,在新的wordpress上并不完全适用,会把后台的图标字体也变为微软雅黑,这就导致一部分图标无法正常显示了……于是我又干脆自己重新写了一个,经测试在wordpress 4.7中可以完美将所有后台字体变为微软雅黑而又没有副作用!

代码(使用方法和原来的一样)如下:

  1. /**
  2.  * wordpress后台字体更改
  3.  * @模块描述 将wordpress后台界面的字体由宋体改为微软雅黑
  4.  * @模块作者 mengkun
  5.  * @作者链接 https://mkblog.cn/
  6.  * @模块版本 1.0
  7.  */
  8. function mk_admin_font(){
  9.     echo '
  10.         <style type="text/css">
  11.             body,   /*修改页面大部分的字体*/
  12.             #wpadminbar *,  /*修改顶部菜单栏字体*/
  13.             .media-frame, .media-modal, .media-frame input[type=text],  /*以下全是修改媒体库界面的字体*/
  14.             .media-frame input[type=password], .media-frame input[type=number],
  15.             .media-frame input[type=search], .media-frame input[type=email],
  16.             .media-frame input[type=url], .media-frame select, .media-frame textarea
  17.             { font-family: "Microsoft YaHei"; } /*这里不限于微软雅黑,可以是任意你喜欢的字体*/
  18.         </style>
  19.     ';
  20. }
  21. add_action('admin_head', 'mk_admin_font');

打赏
发表评论
表情 图片 链接 代码

  1. 皮皮豪
    皮皮豪 Lv 1

    不行啊 添加代码后如图 查看图片

    • mengkun
      mengkun 站长

      @皮皮豪要在 function.php 的

      ?>

      前面添加

分享
微信
微博
QQ