阿里圖標 iconfont 本地化

2022-07-04 發(fā)布于OneNav

最近阿里圖標 iconfont 出問題了,無法提供在線CDN服務,導致很都小伙伴在為OneNav導航主題添加圖標時失去了很多個性化的內(nèi)容,既然只是無法提供在線CDN服務,其他功能一切正常,那么就可以下載自己創(chuàng)建的圖標項目到本地,在設置里添加本地的阿里圖標地址就可以了。

阿里云服務已經(jīng)恢復,如果不想本地化,請查看教程:阿里云圖標的使用方法

創(chuàng)建阿里圖標項目

重復一下項目設置項,好多都設置錯誤,請注意下圖紅框框選的內(nèi)容,一定要和圖一樣。

阿里圖標 iconfont 本地化

下載項目

創(chuàng)建好項目并且添加好圖標后,點“下載至本地”按鈕下載項目,阿里項目設置詳細請查看教程

阿里圖標 iconfont 本地化

上傳到網(wǎng)站

建下載的壓縮包上傳到網(wǎng)站,用自己熟悉的工具(方法)上傳即可,我用寶塔。

  1. 在網(wǎng)站的 wp-content 目錄里新建文件夾,命名為 ico
  2. 上傳壓縮包到 ico 目錄。
  3. 解壓壓縮包。
阿里圖標 iconfont 本地化阿里圖標 iconfont 本地化

目錄結構如小圖

阿里圖標 iconfont 本地化

獲取圖標地址

解壓后進入圖標文件夾,會看到一些 css、ttf 等文件。

圖標css地址為 域名+wp-content/ico+壓縮包解壓后的文件夾名稱+iconfont.css

比如我示例地址為:https://nav.iowen.cn/wp-content/ico/font_2978079_1mv1hedql3m/iconfont.css

阿里圖標 iconfont 本地化

添加圖標到主題

將地址添加到主題設置中的“阿里圖標庫地址”選項中。

阿里圖標 iconfont 本地化

這樣就可以在需要添加圖標的地方選擇圖標了。

阿里圖標 iconfont 本地化

可能存在的問題

如果你添加圖標地址后,在“添加圖標”的彈窗中沒有看到圖標(如下圖),是你站點 ssl 證書導致的,通常是 Let's Encrypt 證書引起的,原因。。。我不知道。。。

請使用寶塔提供的一年免費證書,或者其他證書。

可以試試這個通配證書(目前¥88/年)填寫優(yōu)惠碼?iotheme 可以優(yōu)惠30元,獲取證書。

阿里圖標 iconfont 本地化
仍然有問題? 我們要如何幫助您?
One Nav 導航主題