为什么添加Font Awesome图标有些不显示?

 boke112联盟   2020-10-16 18:39:52 更新  建站经验

现在很多 WordPress 或 ZBlogPHP 主题都集成有个性化图标,比如Blogs 主题就集成了 Font Awesome 图标,用户无需安装插件即可添加个性化图标,但是有些用户反馈说添加的图标有些显示有些却不显示。

其实这是因为 Font Awesome 版本问题。比如目前 Blogs 主题集成的是 Font Awesome 5.0.13 版本,现在 Font Awesome 在 2019 年 6 月 4 日已经升级到 5.9.0 了。每一个版本几乎都会有一些新图标出来,所以如果你使用了高版本的图标,那么就无法显示了。

那么我们怎么知道那个图标是对应那个版本的呢?这个很简单,打开Font Awesome 官网,建议选择免费图标,然后点击我们想要的图标(如点击地址簿图标 address-book)。具体如下图所示:

为什么添加Font Awesome图标有些不显示? - 第1张 - boke112联盟(boke112.com)

在出现的“address-book”页面右上角就能看到该图标更新于 5.0.3 版本,具体如下图红圈位置:

为什么添加Font Awesome图标有些不显示? - 第2张 - boke112联盟(boke112.com)

Blogs 主题集成的 Font Awesome 是 5.0.13 版本,那么就可以直接使用这个 address-book 图标。如果集成的版本低于 5.0.3,那么添加这个图标就会显示。

确定这个图标能够使用后,点击【Start Using This Icon】按钮,然后点击下图红色箭头所示的复制图标按钮即可复制该图标 HTML 代码,然后粘贴到文件想要显示的位置即可。

为什么添加Font Awesome图标有些不显示? - 第3张 - boke112联盟(boke112.com)

现在知道添加 Font Awesome 某些图标不显示的原因之后,再遇到这种情况,可以考虑换其他适合使用的图标,或者更新主题所集成的 Font Awesome 版本。

您可能感兴趣的文章

文章标签: ,  更多热门标签>>
版权声明:本文为原创文章,版权归 boke112联盟 所有,欢迎分享本文,转载请保留出处!发布此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请与老古(QQ:2226524923)联系,老古将及时更正、删除,谢谢。
  1. yogo
    yogo

    尝试添加最新的5.12.0版本,折腾一个小时,失败。

  2. 轩沫博客
    轩沫博客

    还是没有效果啊

    • 懿古今
      懿古今2019-06-08 16:56

      @轩沫博客首先要确保站点支持Font Awesome,其次要看是否正确添加了代码,一般两样都确保了就正常了。

  3. 趣知识
    趣知识

    我用typcho

    • 懿古今
      懿古今2019-06-08 17:02

      @趣知识这个Font Awesome图标应该可以用在各种建站程序

  4. nice
    nice

    我用的 WP 家的 Dashicons

    • 懿古今
      懿古今2019-06-08 17:03

      @nice这个估计更好,不用另外加载其他文件

  5. 纯洁博客
    纯洁博客

    我就说我菜单怎么感觉差点东西

  6. 闲鱼
    闲鱼

    我之前的心态就是能添加图标的地方都添加上,现在是能不用的都不用,比如菜单 [偷笑]

    • 懿古今
      懿古今2019-06-08 17:04

      @闲鱼我现在也就是在菜单添加,其他地方也不想用。其实都是文字最好,有些站点内容正常图标不正常

  7. wordpress建站吧
    wordpress建站吧

    之前一直不了解这个,前段时间才刚看了一些

  8. 频敏变阻器
    频敏变阻器

    可以看一下css路径是不是写错了,或者查看font文件夹字体文件和字体资源路径是否正确

    • 懿古今
      懿古今2019-06-08 17:05

      @频敏变阻器一般主题集成这个功能的话都可以排除路径问题,一般都是添加的图标版本太高

  9. MAY的SEO博客
    MAY的SEO博客

    这个是不是跟阿里巴巴矢量库图标一样的?

  10. 明月登楼
    明月登楼

    对这些第三方的调用,能不用就不用,能用的就不折腾!

    • 懿古今
      懿古今2019-06-06 17:04

      @明月登楼个性化图标,目前好像都是第三方的居多,很少有站长自己亲自去做一个图标出来

  11. SKY8G网
    SKY8G网

    这个Wordpress也有这个,有了这个不会放大失真了,占用内存小。

    • 懿古今
      懿古今2019-06-06 17:04

      @SKY8G网是的,这也是很多人喜欢使用字体图标的原因