主题自带的图标只有80几个，仅用于主题基本元素的装饰。
WordPress自带图标，点击一个图标，然后再次点“Copy HTML”，会看到类似：
<span class="dashicons dashicons-wordpress"></span>
打开菜单设置页面，右上角的”显示选项“，在“显示高级菜单属性”中勾选“CSS类”，并将dashicons dashicons-wordpress添加到菜单某个菜单项的“CSS类”中，保存菜单，刷新前端页面会看到WP的图标。
先试试WP自带的图标库，看看效果和菜单添加图标基本操作，再研究下面的自定义图标。
阿里巴巴图标库的优势
主题目前使用的阿里巴巴矢量图标库（Iconfont）与常用的 Font Awesome 图标，有绝对的优势：
图标字体多
目前Iconfont大约有近两千万个图标（完全免费），而Font Awesome只有600多（部分收费），让你有更多的选择。
按需使用
Font Awesome不论你使用几个图标字体，都需要完整加载字体库（1M多），而Iconfont可以按你所需定制图标字体库，并且可以根据你的需要随时更改，目前主题必须的字体图标库只有100多K。
可以外链字体库
使用Iconfont图标字体，不一定要在本地加载，可以直接将生成的字体库链接添加到主题中。
阿里巴巴图标库使用方法
使用说明可能看着有点长，但阿里巴巴图标库使用其实非常简单。
一、注册登录阿里巴巴图标库
访问：阿里巴巴矢量图标库
目前支持GitHub和新浪微博账号授权登录，注册登录后需要绑定手机号，或者可以直接手机号注册登录。
二、新建图标库项目
单色和彩色图标需要分别建不同的项目。
登录图标库后，顶部菜单 → 资源管理 → 我的项目，点击“新建项目图标”
单色图标
在弹窗中输入相关信息：
项目名称：名称任意
FontClass/ Symbol 前缀：必须输入zm-
Font Family：必须输入zm
字体格式，分别勾选： WOFF2、WOFF、TTF
点击“新建”，完成图标库创建，但目前图标库是空的，需要为图标库添加图标。
彩色图标
项目名称：名称任意
FontClass/ Symbol 前缀：必须输入cx-
Font Family：必须输入cx
字体格式，分别勾选： 彩色、WOFF2、WOFF、TTF
点击“新建”，完成图标库创建，但目前图标库是空的，需要为图标库添加图标。
三、为图标库添加图标
点击菜单上的素材库 → 图标库，选择一个图标库。
用鼠标选择一个图标并点击上面的购物车图标，将图标添加到购物车中待用，如图：
选择添加完图标，点击顶部菜单右侧的购物车图标：
尽量选择添加线条较粗的图标字体，显示效果会好些。
在右侧弹窗中点击“添加至项目”按钮，在“加入项目”中选择刚建图标库。
点击“确定”，完成图标添加，想再添加其它图标，重复上面的操作。
彩色图标添加到图标项目中方法相同。
需要注意的是，单色和彩色图标不要混合在一起添加。
四、加载图标字体库
加载图标目前分两种模式：本地和外链，外链使用方便，但可能稳定性不好，影响加载速度，仅适于测试图标效果时使用，两种模式不要混合使用。
本地模式
进入主题选项 → 辅助功能 → 阿里图标库，分别勾选“单色图标”和”彩色图标”并保存设置。
进入刚建的图标项目，点击“下载至本地”，会得到一个download.zip的压缩包，解压后将里面类似font_3620813_a2k0ub23yuh文件夹名称分别改为：
单色：font
彩色：icon
上传到WP程序wp-content目录中。
如果未上传图标库文件，不要勾选对应的选项。
外链
进入图标库，点击“点此生成”按钮。
再点击“点此复制代码”
彩色图标是需要切换到“Symbol”生成的是js后缀的链接代码，单色是css后缀。
将链接代码分别添加到单色图标链接和彩色图标链接中
如果修改添加了图标项目，需要重新获取链接，并到主题选项相应修改链接。
五、为菜单项添加字体图标
登录WP后台→外观→菜单，进入菜单编辑管理页面，添加图标字体需要显示菜单高级属性，打开右上角的”显示选项“，在“界面元素”中勾选，页面、自定义链接及分类等必须的内容，同时勾选所有高级菜单属性中的项目，如图：
单色图标
返回已建好的图标字体库页面，用鼠标复制图标代码，例如：zm-xianshi
添加到菜单项目的CSS类中，前面需再加一个zm ，最终如：zm zm-xianshi
彩色图标
返回已建好的图标字体库页面，用鼠标复制图标代码，例如：cx-shoucang
添加到菜单项目的CSS类中
最图效果：
主题其它位置使用图标字体，与菜单添加方法类似，
单色图标代码：zm zm-xianshi
彩色图标代码：cx-shoucang
常见问题
如果未显示图标，请检查是否按第二步新建图标库项目中要求的：
单色图标：
FontClass/ Symbol 前缀：必须输入zm-
Font Family：必须输入zm
彩色图标：
FontClass/ Symbol 前缀：必须输入cx-
Font Family：必须输入cx
可以编辑项目按要求修改相关信息。
Iconfont图标字体，有个问题就是图标字体大小不一，同一个字体库的也是如此，还好Iconfont提供了非常方便的编辑工具，可以自己调整大小、旋转等编辑操作。
另外，由于Iconfont图标众多，很多图标字体的代码名称都是相同的，可能会相互冲突，不显示对应的图标，如果添加自定义图标后，发现某个图标显示为另外的其它的图标，就需要修改自定义图标代码名称：
其中Unicode(16进制)代码，比如下图这个图标的Unicode代码 e636，就与主题默认的新浪微博的图标相同随便改一个，但必须是字母e开头6以后的数字和字母组合，如改为：e6f7
同时，Font Class / Symbol中的名称也不能有重复的。
不要把胡乱地把一些图标都弄到字库中项目中，使用哪个就添加哪个，不然会引起更多的字体名称冲突，而且会在一定程度上影响加载速度。
如果菜单上只想显示图标，不显示文字，用空格符号 代替文字。
Font Awesome 图标
如果你喜欢用Font Awesome图标，可以安装 Font Awesome 4 Menus 插件，两者没有冲突。
添加举例：fa fa-desktop
如果Font Awesome 4 Menus插件也不想用，还可以选择将外链 Font Awesome 图标库：
//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css
添加到单色图标链接中
然后在编辑菜单时，在导航标签中直接输入类似的：
<i class="fa fa-desktop"></i> 标题文字
最终显示效果相同，就是加载速度稍差。
如果只想在菜单上添加图标，有个更简单的方法，随便找个图标，点击下载图标，在弹窗中点击“复制SVG代码”，然后让代码粘贴到菜单项“导航标签”文字前面即可。
最终与调用图标库中的图标效果相同，就是查看源代码时，有一堆SVG图片代码，不会对SEO之类的产生任何影响。
