WordPress为导航菜单添加个性图标字体

WordPress为导航菜单添加个性图标字体

目前图标字体非常流行,图标字体使用简单,与图片格式的小图标相比,支持视网膜显示,可以无限放大。特别是一些响应式设计的主题模板,都会或多或少使用图标字体。我们还可以单独为导航菜单上的项目也配上个性化的图标字体。具体方法:一、WP后台--插件--安装插件页...
目前图标字体非常流行,图标字体使用简单,与图片格式的小图标相比,支持视网膜显示,可以无限放大。特别是一些响应式设计的主题模板,都会或多或少使用图标字体。我们还可以单独为导航菜单上的项目也配上个性化的图标字体。
具体方法:
一、WP后台–插件–安装插件页面搜索:Font Awesome 4 Menus,下载安装并启用。
二、WP后台—外观—菜单,进入菜单设置页面,选择并编辑一个菜单项,在CSS类中输入一个图标字体选择器名称,如图:如果在编辑菜单项目面板中无CSS类,可以打开右上角的“显示选项”,在显示菜单高级属性中勾选“CSS类”。(今天才发现有这个的!!!)

图标字体选择器名称,打开此页查看:http://fontawesome.io/icons/

点开一个认为合适的图标字体,在下会显示类似:

  1. <i class=“fa fa-home”></i>

只需在菜单CSS类中输入fa fa-home就可以了。

那然这个图标字体库并不只局限于使用在导航菜单上,只要把相应的图标代码加到主题模板的相应位置,也同样可以显示。

如果认为上面插件提供的图标字体不符合自己的要求(其实这套Font Awesome图标字体早已烂大街),还可以自己做一套更加个性化的图标字体。

图标字体在线制作:https://icomoon.io/app/#/select

 

 

版权申明:
版权声明

①:本站文章均为原创,除非另有说明,否则本站内容依据CC BY-NC-SA 4.0许可证进行授权,转载请附上出处链接,谢谢。
②:本站提供的所有资源均为网上搜集,不保证能100%完整,如有涉及或侵害到您的版权请立即通知我们。
③:本站所有下载文件,仅用作学习研究使用,请下载后24小时内删除,支持正版,勿用作商业用途。
④:本站保证所提供资源的完整性,但不含授权许可、帮助文档、XML文件、PSD、后续升级等。
⑤:使用该资源需要用户有一定代码基础知识!由本站提供的资源对您的网站或计算机造成严重后果的本站概不负责。
⑥:本站资源售价只是赞助,收取费用仅维持本站的日常运营所需。
⑦:如果喜欢本站资源,欢迎捐助本站开通会员享受优惠折扣,谢谢支持!
⑧:如果网盘地址失效,请在相应资源页面下留言,我们会尽快修复下载地址。

0

评论0

请先

会员低至49元,开通享海量VIP资源免费下载 自助开通
显示验证码
没有账号?注册  忘记密码?