How to Add FangSong and FangSong_GB2312 Fonts to Baidu UEditor

Baidu UEditor is a widely used rich‑text editor in web development, but its default configuration does not include the Chinese fonts FangSong and FangSong_GB2312 required by some clients.

This article shows how to extend the editor’s font list so that these two fonts become selectable.

First, the editor defines a set of font mappings in ueditor/lang/zh-cn/zh-cn.js. The default mapping looks like this:

<span>'songti':'宋体',</span>
<span>'kaiti':'楷体',</span>
<span>'heiti':'黑体',</span>
<span>'lishu':'隶书',</span>
<span>'yahei':'微软雅黑',</span>
<span>'andaleMono':'andale mono',</span>
<span>'arial':'arial',</span>
<span>'arialBlack':'arial black',</span>
<span>'comicSansMs':'comic sans ms',</span>
<span>'impact':'impact',</span>
<span>'timesNewRoman':'times new roman'</span>

In addition, many Chinese fonts have specific identifiers, for example FangSong for 仿宋 and FangSong_GB2312 for 仿宋GB2312. A more comprehensive list of Chinese font identifiers is also provided in the article.

To make the two required fonts available, follow these two steps:

1. Edit the language file ueditor/lang/zh-cn/zh-cn.js. Locate the fontfamily object and add the two entries:

'fontfamily':{
    'songti':'宋体',
    'kaiti':'楷体',
    'heiti':'黑体',
    'FangSong':'仿宋',
    'FangSong_GB2312':'仿宋_GB2312',
    'lishu':'隶书',
    'yahei':'微软雅黑',
    'andaleMono':'andale mono',
    'arial':'arial',
    'arialBlack':'arial black',
    'comicSansMs':'comic sans ms',
    'impact':'impact',
    'timesNewRoman':'times new roman'
},

2. Edit the configuration file ueditor/ueditor.config.js (or ueditor/editor_config.js depending on the version). Find the commented fontfamily array around line 180, uncomment it, and add the new font entries:

, 'fontfamily':[ 
    { label:'', name:'songti', val:'宋体,SimSun' },
    { label:'', name:'kaiti', val:'楷体,楷体_GB2312, SimKai' },
    { label:'', name:'yahei', val:'微软雅黑,Microsoft YaHei' },
    { label:'', name:'heiti', val:'黑体, SimHei' },
    { label:'', name:'SimSun', val:'仿宋,SimSun' },
    { label:'', name:'FangSong_GB2312', val:'仿宋_GB2312 ,FangSong_GB2312' },
    { label:'', name:'lishu', val:'隶书, SimLi' },
    { label:'', name:'andaleMono', val:'andale mono' },
    { label:'', name:'arial', val:'arial, helvetica,sans-serif' },
    { label:'', name:'arialBlack', val:'arial black,avant garde' },
    { label:'', name:'comicSansMs', val:'comic sans ms' },
    { label:'', name:'impact', val:'impact,chicago' },
    { label:'', name:'timesNewRoman', val:'times new roman' }
]

After saving both files and reloading the editor, the fonts “FangSong” and “FangSong_GB2312” will appear in the font dropdown, allowing authors to meet the client’s typography requirements.

This method can be adapted to add any other custom fonts to Baidu UEditor.