My English is not good, and the content of this article is mainly for Chinese users, so the following content is published in Chinese.
Because it is difficult to access Font Awesome in China, this article is mainly to help you how to use the icon resource in China
Although the Flarum team has stored the Font Awesome icon locally, it is difficult for Chinese users to access Font Awesome, so I do n't know which icons can be selected. It is recommended that the Flarum team update the next version to display the Font Awesome icon directly in the background. , Let users select by clicking. This will be much more convenient.
After all, there are more and more Flarum users in China.
事实上，Flarum已经本地化了五六百个Font Awesome图标，网上有很多cdn加速Font Awesome的方法，但事实上，新版本的Flarum系统根本不会去访问Font Awesome，因为系统图标已经被官方全部放在本地了。我们只知道这些图标分别叫什么，就直接可以拿来用，但重点是，我们需要图标的时候，根本不知道Font Awesome有哪些图标，必须访问Font Awesome网站才能知道这些图标分别叫什么名字。
但在中国访问Font Awesome速度很慢。
另外一点比较麻烦的是，我们即使知道这些图标叫什么名字，或许也根本找不到我们需要的一些专业性比较强的图标。
比如下图这些：
现在我教大家如何在保留官方图标的同时，也可以使用中国国内一些站点的icon图标。
在中国最出名的icon图标网站是 https://www.iconfont.cn/
所以我们就用https://www.iconfont.cn/做示范
第一步
登录https://www.iconfont.cn/
第二步
搜索自己所需要的图标，如下图，我搜索一个vue的图标，然后就可以看到很多vue的图标。
第三步
鼠标放在自己选择好的图标上面，选择第一个购物车的图标
第四步
可以按照以上的步骤，多选择一些自己需要的图标，这时，我们看网站右下角的浮动按钮，这就是我刚才选择的所有图标。
第五步
点击这个按钮，可以将选择的这些图标加入项目。如下图，如果没有项目，就创建一个项目。
红色箭头是我创建好的项目，如果你们没创建项目，就点蓝色箭头这里，新建一个项目就可以。
第六步
进入到刚才的项目。选择font class模式。绿色箭头就是你这个图标项目的图标库链接。一会我们就需要将这个链接应用到Flarum站点中。下面红色的箭头就是这个图标的名称。我们在任何地方需要这些图标，就直接使用这些图标名称就可以。
第七步
我们复制上面绿色箭头的css地址。复制在Flarum站点后台的 外观 - 自定义css样式中。
代码是：
@import url(//at.alicdn.com/t/font_1658856_cgbic72fde5.css);
.iconfont {
font-size:inherit
}
将上面css地址替换成你的项目css地址就可以。下面这个.iconfont的作用，是因为iconfont的图标css库，会自动给图标加一个16px的大小，这里我们需要将这个属性去掉，使用Flarum默认的样式。
第八步
也是最后一步，现在我们只需要将图标用在需要的地方就可以，比如后台的节点图标，我们只需要填写 fas iconfont icon-vuejs 这里一共是三个class。第三个才是我们的图标名称。前面的fas iconfont是必须的。我们只需要修改第三个地方的名称即可。
第九步
最终效果图下图，既保留了Flarum默认的图标，想使用Flarum系统本身的图标的时候，还和之前一样使用就可以。本文这种方式对之前的方式没有任何干扰。如果想用iconfont的图标，就这样用就可以。也可以一起用。
最后，附上Flarum系统本身的600多个图标名称
fa-glass
fa-meetup
fa-star-o
fa-star-o
fa-remove
fa-close
fa-gear
fa-trash-o
fa-trash-o
fa-file-o
fa-file-o
fa-clock-o
fa-clock-o
fa-arrow-circle-o-down
fa-arrow-circle-o-down
fa-arrow-circle-o-up
fa-arrow-circle-o-up
fa-play-circle-o
fa-play-circle-o
fa-repeat
fa-rotate-right
fa-refresh
fa-list-alt
fa-dedent
fa-video-camera
fa-picture-o
fa-picture-o
fa-photo
fa-photo
fa-image
fa-image
fa-pencil
fa-map-marker
fa-pencil-square-o
fa-pencil-square-o
fa-share-square-o
fa-share-square-o
fa-check-square-o
fa-check-square-o
fa-arrows
fa-times-circle-o
fa-times-circle-o
fa-check-circle-o
fa-check-circle-o
fa-mail-forward
fa-eye
fa-eye-slash
fa-warning
fa-calendar
fa-arrows-v
fa-arrows-h
fa-bar-chart
fa-bar-chart
fa-bar-chart-o
fa-bar-chart-o
fa-twitter-square
fa-ebook-square
fa-gears
fa-thumbs-o-up
fa-thumbs-o-up
fa-thumbs-o-down
fa-thumbs-o-down
fa-heart-o
fa-heart-o
fa-sign-out
fa-linkedin-square
fa-linkedin-square
fa-thumb-tack
fa-external-link
fa-sign-in
fa-github-square
fa-lemon-o
fa-lemon-o
fa-square-o
fa-square-o
fa-bookmark-o
fa-bookmark-o
fa-twitter
fa-ebook-f
fa-github
fa-credit-card
fa-feed
fa-hdd-o
fa-hdd-o
fa-hand-o-right
fa-hand-o-right
fa-hand-o-left
fa-hand-o-left
fa-hand-o-up
fa-hand-o-up
fa-hand-o-down
fa-hand-o-down
fa-arrows-alt
fa-group
fa-chain
fa-scissors
fa-files-o
fa-files-o
fa-floppy-o
fa-floppy-o
fa-navicon
fa-reorder
fa-pinterest
fa-pinterest-square
fa-google-plus-square
fa-google-plus
fa-google-plus
fa-money
fa-money
fa-unsorted
fa-sort-desc
fa-sort-asc
fa-linkedin
fa-linkedin
fa-rotate-left
fa-legal
fa-tachometer
fa-dashboard
fa-comment-o
fa-comment-o
fa-comments-o
fa-comments-o
fa-flash
fa-clipboard
fa-paste
fa-paste
fa-lightbulb-o
fa-lightbulb-o
fa-exchange
fa-cloud-download
fa-cloud-upload
fa-bell-o
fa-bell-o
fa-cutlery
fa-file-text-o
fa-file-text-o
fa-building-o
fa-building-o
fa-hospital-o
fa-hospital-o
fa-tablet
fa-mobile
fa-mobile-phone
fa-circle-o
fa-circle-o
fa-mail-reply
fa-github-alt
fa-folder-o
fa-folder-o
fa-folder-open-o
fa-folder-open-o
fa-smile-o
fa-smile-o
fa-frown-o
fa-frown-o
fa-meh-o
fa-meh-o
fa-keyboard-o
fa-keyboard-o
fa-flag-o
fa-flag-o
fa-mail-reply-all
fa-star-half-o
fa-star-half-o
fa-star-half-empty
fa-star-half-empty
fa-star-half-full
fa-star-half-full
fa-code-fork
fa-chain-broken
fa-shield
fa-calendar-o
fa-calendar-o
fa-maxcdn
fa-html5
fa-css3
fa-ticket
fa-minus-square-o
fa-minus-square-o
fa-level-up
fa-level-down
fa-pencil-square
fa-external-link-square
fa-compass
fa-caret-square-o-down
fa-caret-square-o-down
fa-toggle-down
fa-toggle-down
fa-caret-square-o-up
fa-caret-square-o-up
fa-toggle-up
fa-toggle-up
fa-caret-square-o-right
fa-caret-square-o-right
fa-toggle-right
fa-toggle-right
fa-eur
fa-euro
fa-gbp
fa-usd
fa-dollar
fa-inr
fa-rupee
fa-jpy
fa-cny
fa-rmb
fa-yen
fa-rub
fa-ruble
fa-rouble
fa-krw
fa-won
fa-btc
fa-bitcoin
fa-bitcoin
fa-file-text
fa-sort-alpha-asc
fa-sort-alpha-desc
fa-sort-amount-asc
fa-sort-amount-desc
fa-sort-numeric-asc
fa-sort-numeric-desc
fa-youtube-square
fa-youtube
fa-xing
fa-xing-square
fa-youtube-play
fa-youtube-play
fa-dropbox
fa-stack-overflow
fa-instagram
fa-flickr
fa-adn
fa-bitbucket
fa-bitbucket-square
fa-bitbucket-square
fa-tumblr
fa-tumblr-square
fa-long-arrow-down
fa-long-arrow-up
fa-long-arrow-left
fa-long-arrow-right
fa-apple
fa-windows
fa-android
fa-linux
fa-dribbble
fa-skype
fa-foursquare
fa-trello
fa-gratipay
fa-gittip
fa-gittip
fa-sun-o
fa-sun-o
fa-moon-o
fa-moon-o
fa-vk
fa-weibo
fa-renren
fa-pagelines
fa-stack-exchange
fa-arrow-circle-o-right
fa-arrow-circle-o-right
fa-arrow-circle-o-left
fa-arrow-circle-o-left
fa-caret-square-o-left
fa-caret-square-o-left
fa-toggle-left
fa-toggle-left
fa-dot-circle-o
fa-dot-circle-o
fa-vimeo-square
fa-try
fa-turkish-lira
fa-plus-square-o
fa-plus-square-o
fa-slack
fa-wordpress
fa-openid
fa-institution
fa-bank
fa-mortar-board
fa-yahoo
fa-google
fa-reddit
fa-reddit-square
fa-stumbleupon-circle
fa-stumbleupon
fa-delicious
fa-digg
fa-pied-piper-pp
fa-pied-piper-alt
fa-drupal
fa-joomla
fa-spoon
fa-behance
fa-behance-square
fa-steam
fa-steam-square
fa-automobile
fa-cab
fa-envelope-o
fa-envelope-o
fa-deviantart
fa-soundcloud
fa-file-pdf-o
fa-file-pdf-o
fa-file-word-o
fa-file-word-o
fa-file-excel-o
fa-file-excel-o
fa-file-powerpoint-o
fa-file-powerpoint-o
fa-file-image-o
fa-file-image-o
fa-file-photo-o
fa-file-photo-o
fa-file-picture-o
fa-file-picture-o
fa-file-archive-o
fa-file-archive-o
fa-file-zip-o
fa-file-zip-o
fa-file-audio-o
fa-file-audio-o
fa-file-sound-o
fa-file-sound-o
fa-file-video-o
fa-file-video-o
fa-file-movie-o
fa-file-movie-o
fa-file-code-o
fa-file-code-o
fa-vine
fa-codepen
fa-jsfiddle
fa-life-ring
fa-life-bouy
fa-life-bouy
fa-life-buoy
fa-life-buoy
fa-life-saver
fa-life-saver
fa-support
fa-support
fa-circle-o-notch
fa-rebel
fa-ra
fa-ra
fa-resistance
fa-resistance
fa-empire
fa-ge
fa-ge
fa-git-square
fa-git
fa-hacker-news
fa-y-combinator-square
fa-y-combinator-square
fa-yc-square
fa-yc-square
fa-tencent-weibo
fa-qq
fa-weixin
fa-wechat
fa-wechat
fa-send
fa-paper-plane-o
fa-paper-plane-o
fa-send-o
fa-send-o
fa-circle-thin
fa-circle-thin
fa-header
fa-sliders
fa-futbol-o
fa-futbol-o
fa-soccer-ball-o
fa-soccer-ball-o
fa-slideshare
fa-twitch
fa-yelp
fa-newspaper-o
fa-newspaper-o
fa-paypal
fa-google-wallet
fa-cc-visa
fa-cc-mastercard
fa-cc-discover
fa-cc-amex
fa-cc-paypal
fa-cc-stripe
fa-bell-slash-o
fa-bell-slash-o
fa-trash
fa-copyright
fa-eyedropper
fa-area-chart
fa-pie-chart
fa-line-chart
fa-lastfm
fa-lastfm-square
fa-ioxhost
fa-angellist
fa-cc
fa-cc
fa-ils
fa-shekel
fa-sheqel
fa-meanpath
fa-meanpath
fa-buysellads
fa-connectdevelop
fa-dashcube
fa-forumbee
fa-leanpub
fa-sellsy
fa-shirtsinbulk
fa-simplybuilt
fa-skyatlas
fa-diamond
fa-diamond
fa-intersex
ebook-official
ebook-official
fa-pinterest-p
fa-whatsapp
fa-hotel
fa-viacoin
fa-medium
fa-y-combinator
fa-yc
fa-yc
fa-optin-monster
fa-opencart
fa-expeditedssl
fa-battery-4
fa-battery
fa-battery-3
fa-battery-2
fa-battery-1
fa-battery-0
fa-object-group
fa-object-ungroup
fa-sticky-note-o
fa-sticky-note-o
fa-cc-jcb
fa-cc-diners-club
fa-clone
fa-hourglass-o
fa-hourglass-o
fa-hourglass-1
fa-hourglass-2
fa-hourglass-3
fa-hand-rock-o
fa-hand-rock-o
fa-hand-grab-o
fa-hand-grab-o
fa-hand-paper-o
fa-hand-paper-o
fa-hand-stop-o
fa-hand-stop-o
fa-hand-scissors-o
fa-hand-scissors-o
fa-hand-lizard-o
fa-hand-lizard-o
fa-hand-spock-o
fa-hand-spock-o
fa-hand-pointer-o
fa-hand-pointer-o
fa-hand-peace-o
fa-hand-peace-o
fa-registered
fa-creative-commons
fa-gg
fa-gg-circle
fa-tripadvisor
fa-odnoklassniki
fa-odnoklassniki-square
fa-get-pocket
fa-wikipedia-w
fa-si
fa-chrome
fa-firefox
fa-opera
fa-internet-explorer
fa-television
fa-contao
fa-500px
fa-amazon
fa-calendar-plus-o
fa-calendar-plus-o
fa-calendar-minus-o
fa-calendar-minus-o
fa-calendar-times-o
fa-calendar-times-o
fa-calendar-check-o
fa-calendar-check-o
fa-map-o
fa-map-o
fa-commenting
fa-commenting-o
fa-commenting-o
fa-houzz
fa-vimeo
fa-vimeo
fa-black-tie
fa-fonticons
fa-reddit-alien
fa-edge
fa-credit-card-alt
fa-codiepie
fa-modx
fa-fort-awesome
fa-usb
fa-product-hunt
fa-mixcloud
fa-scribd
fa-pause-circle-o
fa-pause-circle-o
fa-stop-circle-o
fa-stop-circle-o
fa-bluetooth
fa-bluetooth-b
fa-gitlab
fa-wpbeginner
fa-wpforms
fa-envira
fa-wheelchair-alt
fa-wheelchair-alt
fa-question-circle-o
fa-question-circle-o
fa-volume-control-phone
fa-asl-interpreting
fa-deafness
fa-hard-of-hearing
fa-glide
fa-glide-g
fa-signing
fa-viadeo
fa-viadeo-square
fa-snapchat
fa-snapchat-ghost
fa-snapchat-square
fa-pied-piper
fa-first-order
fa-yoast
fa-themeisle
fa-google-plus-official
fa-google-plus-official
fa-google-plus-circle
fa-google-plus-circle
fa-font-awesome
fa-handshake-o
fa-handshake-o
fa-envelope-open-o
fa-envelope-open-o
fa-linode
fa-address-book-o
fa-address-book-o
fa-vcard
fa-address-card-o
fa-address-card-o
fa-vcard-o
fa-vcard-o
fa-user-circle-o
fa-user-circle-o
fa-user-o
fa-user-o
fa-id-badge
fa-drivers-license
fa-id-card-o
fa-id-card-o
fa-drivers-license-o
fa-drivers-license-o
fa-quora
fa-free-code-camp
fa-telegram
fa-thermometer-4
fa-thermometer
fa-thermometer-3
fa-thermometer-2
fa-thermometer-1
fa-thermometer-0
fa-bathtub
fa-s15
fa-window-maximize
fa-window-restore
fa-times-rectangle
fa-window-close-o
fa-window-close-o
fa-times-rectangle-o
fa-times-rectangle-o
fa-bandcamp
fa-grav
fa-etsy
fa-imdb
fa-ravelry
fa-eercast
fa-eercast
fa-snowflake-o
fa-snowflake-o
fa-superpowers
fa-wpexplorer
fa-spotify
