WPCOM線上的WordPress主題目前均支持圖標(biāo)的設(shè)置,并且我們內(nèi)置了3款優(yōu)秀的圖標(biāo)可供使用:FontAwesome、Material Icons、Remix Icon,先簡單介紹下這幾款圖標(biāo)吧:

FontAwesome

4.7版本,沒用最新版是因為5.0+版本增加了Pro版,涉及到版權(quán)是一方面的原因,單從免費版來說是不如4.7版本的。

項目地址:https://fontawesome.com/v4.7.0/icons/

Material Icons

Google開源項目,圖標(biāo)豐富

項目地址:https://material.io/resources/icons/

Remix Icon

國人出品的開源圖標(biāo)庫,除了圖標(biāo)豐富質(zhì)量高以外,還有較為完整的國內(nèi)社交媒體圖標(biāo)

項目地址:https://remixicon.com/

自定義圖標(biāo)

除了這幾款內(nèi)置圖標(biāo)以外呢,為了滿足用戶的自定義需求,我們還支持引入自建的iconfont圖標(biāo)項目,具體教程可以參考這篇文章:WPCOM主題Iconfont圖標(biāo)庫添加及使用教程

一、圖標(biāo)的開啟

進(jìn)入后臺主題設(shè)置>風(fēng)格樣式,找到圖標(biāo)設(shè)置選項,然后根據(jù)自己需要選項需要開啟的圖標(biāo),如圖: WPCOM主題圖標(biāo)使用教程

開啟對應(yīng)圖標(biāo)并保存主題設(shè)置以后,別忘了刷新主題設(shè)置頁面(1-2次左右)來清除本地瀏覽器緩存。

二、圖標(biāo)的使用

開啟圖標(biāo)以后,接下來就是如何使用這些圖標(biāo)了,目前主題常見的使用到圖標(biāo)的地方有頁面右側(cè)浮層、手機(jī)端底部浮層、菜單、以及一些模塊等,具體可以留意設(shè)置選項信息。

下面我們以頁面右側(cè)浮層的圖標(biāo)設(shè)置為例

首先我們找到對應(yīng)選項位置:主題設(shè)置>常規(guī)設(shè)置下的頁面右側(cè)浮層選項,點擊下方的添加選項,可以看到里面有個圖標(biāo)的選項,如圖:

WPCOM主題圖標(biāo)使用教程

這就是一個圖標(biāo)選項了,對于有多個圖標(biāo)庫的情況下選項左邊是可以選擇需要使用到的圖標(biāo)庫,如果只有一個圖標(biāo)庫的情況下左邊的圖標(biāo)庫選項會自動隱藏。

現(xiàn)在我們選擇了Remix Icon,然后再展開右邊,可以看到待選圖標(biāo)列表:

WPCOM主題圖標(biāo)使用教程

如果圖標(biāo)較多,也可以搜索關(guān)鍵字來快速檢索圖標(biāo),比如wechat

WPCOM主題圖標(biāo)使用教程

菜單里面設(shè)置圖標(biāo)

在早期的主題版本中,我們設(shè)置圖標(biāo)是通過添加圖標(biāo)代碼的方式(參考這里),而從2021年年初開始我們已經(jīng)對菜單和小工具的設(shè)置面板做了全面升級(參考這里),目前可以直接在菜單里面使用圖標(biāo)選項來設(shè)置,如圖:

WPCOM主題圖標(biāo)使用教程

關(guān)于更多圖標(biāo)使用中遇到的更多問題,可以聯(lián)系我們在線客服獲取幫助。