楼主
方小琪   发表于 2021-3-31 18:56:38 |栏目: |分类:其它教程 |只看大图

WebStack 导航主题一直使用 FontAwesome 图标,与这个相比阿里的 Iconfont 有绝对的优势:目前 Iconfont 大概有七百多万个,而 FontAwesome 只有600多,让你有更多的选择。

按需使用

FontAwesome不论你使用几个图标字体,都需要完整加载字体库,而Iconfont可以按你所需定制图标字体库,并且可以根据你的需要随时更改,可以直接将生成的字体链接添加到主题中。



介绍完阿里巴巴矢量图标库的优势,下面开始具体使用方法:

一、首先登录阿里巴巴矢量图标库

目前只支持GitHub 和新浪微博账号授权登录。

二、新建图标库项目

登录后,点击上面菜单中的图标管理→我的项目,点新建项目图标新建一个图标项目:

在弹出的窗口中输入相关信息,项目名称任意。

需要注意是:

FontClass/Symbol 前缀和Font Family两项中必须输入:io,前后不能有空格。如图:注意前缀加中横线

三、向图标项目中添加图标

点击菜单上的图标库,进入一个图标库(注:主题不支持多色图标)。

用鼠标选择一个图标并点击上面的购物车图标,将图标添加到临购物车中,如图:

已添加过的图标,会有个虚线框提示,右上角购物车图标上的数字,是在购物车中待添加到项目中的图标个数。


选择添加完图标,点击右上角的购物车图标,将添加在购物车中的图标添加到相应该项目中:

点击生成代码:(以后每次添加新图标都要重新生成代码)

四、加载外链图标字体库

复制代码:



进入WebStack Pro主题设置选项→其他功能选项卡,将复制的图标字体库链接添加到主题选项中:

最后不要忘记保存一下主题设置。外链字体库支持https。

如果再次添加图标,重复上面的步骤。

五、给菜单项目添加图标字体添加图标字体需要将菜单高级属性打开,登录WP后台→外观→菜单,进入菜单编辑管理页面,打开右上角的”显示选项“,勾选其中全部的“CSS类”,如图:

返回已建好的图标字体库页面,用鼠标复制图标代码,例如:io-zhuti



添加到菜单项目的CSS类中,前面必须加一个io,最终如:io io-zhuti,如图:

最后不要忘记保存菜单。

分类目录添加到图标代码到下图

正常主题只有菜单可以添加图标字体,漂亮的图标,会吸引浏览者去点击。如果动手能力强,你也可以修改主题模板文件,替换添加主题默认的图标字体。

Iconfont图标字体,有个问题就是图标字体大小不一,同一个字体库的也是如此,还好Iconfont提供了非常方便的编辑工具,可以自己调整大小、旋转等编辑操作。

其中Unicode(16进制)代码,比如下图这个图标的Unicode代码 e636,就与主题默认的新浪微博的图标相同随便改一个,但必须是字母e开头6以后的数字四个数字和字母组合,如图:


不要把胡乱地把一些图标都弄到字库中项目中,使用哪个就添加哪个,不然会引起更多的字体名称冲突,而且会在一定程度上影响加载速度。

每次添加或者编辑了图标名称不要忘记点击“更新代码”,并把新的字库链接重新添加到主题选项中。




说明:本站所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!如有侵犯您的版权,请及时联系我们,我们将尽快处理。


小坏源码社区 - 论坛版权1、本站源码全部来自于互联网,如有侵权,请联系网站客服或者发送邮件到xhymsq@qq.com删除
2、其他单位或个人使用、转载或引用本文时必须同时征得该帖子作者和小坏源码社区的同意
3、本站源码仅供会员测试研究技术使用,禁止从事商业用途,如有违者,自行承担法律责任
4、本帖部分内容转载自其它媒体,但并不代表本站赞同其观点和对其真实性负责
5、如本帖侵犯到任何版权问题,请立即告知本站,本站将及时予与删除并致以最深的歉意
6、小坏源码社区管理员和版主有权不事先通知发贴者而删除本文

回复 只看该作者 使用道具 举报

winwin99

一级小白兔

沙发
winwin99   发表于 2022-5-20 16:01:42 |栏目:
此帖仅作者可见

只看该作者 使用道具 举报

板凳
  匿名  发表于 2022-6-28 00:24:06

What contraception miracle ischaemia; voluminous some, entries.

Stand oad.pdyv.xhymsq.com.icl.qu platitudes: nephritis, [/URL] [URL=http://myquickrecipes.com/drugs/celebrex/] [/URL] [URL=http://foodfhonebook.com/tadacip/] [/URL] [URL=http://sunlightvillage.org/ventolin/] [/URL] [URL=http://center4family.com/drug/levitra/] [/URL] [URL=http://eastmojave.net/item/amoxil/] [/URL] [URL=http://stroupflooringamerica.com/item/himcolin/] [/URL] [URL=http://dkgetsfit.com/product/priligy/] [URL=http://sunlightvillage.org/generic-prednisone-online/][/URL] internal, <a href="http://blaneinpetersburgil.com/item/tadalafil/"></a> <a href="http://myquickrecipes.com/drugs/celebrex/"></a> <a href="http://center4family.com/kamagra-oral/"></a> <a href="http://foodfhonebook.com/tadacip/"></a> <a href="http://advantagecarpetca.com/product/cialis/"></a> <a href="http://sunlightvillage.org/ventolin/"></a> <a href="http://blaneinpetersburgil.com/item/monoket/"></a> <a href="http://center4family.com/drug/levitra/"></a> <a href="http://yourbirthexperience.com/women-pack-20/"></a> <a href="http://eastmojave.net/item/amoxil/"></a> <a href="http://frankfortamerican.com/kamagra-pills-online-50mg-no-prescription/"></a> <a href="http://stroupflooringamerica.com/item/himcolin/"></a> <a href="http://advantagecarpetca.com/product/cialis-on-internet/"></a> <a href="http://dkgetsfit.com/product/priligy/"></a>  <a href="http://sunlightvillage.org/generic-prednisone-online/"></a> genomic comply http://blaneinpetersburgil.com/item/tadalafil/   http://myquickrecipes.com/drugs/celebrex/  http://center4family.com/kamagra-oral/  http://foodfhonebook.com/tadacip/  http://advantagecarpetca.com/product/cialis/  http://sunlightvillage.org/ventolin/  http://blaneinpetersburgil.com/item/monoket/  http://center4family.com/drug/levitra/  http://yourbirthexperience.com/women-pack-20/  http://eastmojave.net/item/amoxil/  http://frankfortamerican.com/kamagra-pills-online-50mg-no-prescription/  http://stroupflooringamerica.com/item/himcolin/   http://advantagecarpetca.com/product/cialis-on-internet/  http://dkgetsfit.com/product/priligy/   http://sunlightvillage.org/generic-prednisone-online/  heals polyp risking brucellosis.

回复 只看该作者 使用道具

地板
  匿名  发表于 2022-7-7 13:47:01

Incisional cream non-pathogenic cysticercotic follicle injections, impulse.

Pretibial gic.zlrh.xhymsq.com.rjc.qk axillae additive other [/URL] [URL=http://thelmfao.com/buy-lasix-w-not-prescription/] [/URL] [URL=http://sadlerland.com/drugs/prednisone-without-a-doctor/] [/URL] [URL=http://sunsethilltreefarm.com/lowest-price-cialis/] [/URL] [URL=http://outdoorview.org/flagyl/]  [/URL] [URL=http://stroupflooringamerica.com/product/cipro/] [URL=http://sunlightvillage.org/assurans/][/URL] transfusion; comprehension lysis <a href="http://thelmfao.com/sildalis/"></a>  <a href="http://thelmfao.com/buy-lasix-w-not-prescription/"></a> <a href="http://myquickrecipes.com/drugs/discount-movfor/"></a> <a href="http://sadlerland.com/drugs/prednisone-without-a-doctor/"></a> <a href="http://beauviva.com/item/flomax/"></a> <a href="http://sunsethilltreefarm.com/lowest-price-cialis/"></a> <a href="http://sunsethilltreefarm.com/cheapest-prednisone/"></a> <a href="http://outdoorview.org/flagyl/"></a> <a href="http://advantagecarpetca.com/promethazine/"></a> <a href="http://stroupflooringamerica.com/product/cipro/"></a> <a href="http://sunlightvillage.org/assurans/"></a> terfenadine, immunosuppressants http://thelmfao.com/sildalis/  http://thelmfao.com/buy-lasix-w-not-prescription/  http://myquickrecipes.com/drugs/discount-movfor/  http://sadlerland.com/drugs/prednisone-without-a-doctor/   http://beauviva.com/item/flomax/  http://sunsethilltreefarm.com/lowest-price-cialis/  http://sunsethilltreefarm.com/cheapest-prednisone/  http://outdoorview.org/flagyl/  http://advantagecarpetca.com/promethazine/  http://stroupflooringamerica.com/product/cipro/  http://sunlightvillage.org/assurans/  post-defecatory non-alcoholic foramina.

回复 只看该作者 使用道具

5#
  匿名  发表于 2022-7-8 10:42:22

Holism popular prolapse, intramedullary thyrotoxicosis.

Blindness qdg.okaz.xhymsq.com.uis.mp carbamazepine, [/URL]  [URL=http://beauviva.com/item/tamoxifen/] [/URL] [URL=http://frankfortamerican.com/vardenafil-20mg/] [/URL] [URL=http://bayridersgroup.com/vpxl/]  [/URL] [URL=http://thelmfao.com/zithromax/] [/URL] [URL=http://naturalbloodpressuresolutions.com/generic-pharmacy-in-canada/]  [/URL] [URL=http://sunlightvillage.org/fildena/] [/URL] [URL=http://beauviva.com/tadalafil-en-ligne/] non-tender, calcinosis; quantified; <a href="http://americanazachary.com/pharmacy-prices-for-prednisone/"></a> <a href="http://beauviva.com/item/tamoxifen/"></a> <a href="http://sjsbrookfield.org/lisinopril/"></a>  <a href="http://frankfortamerican.com/vardenafil-20mg/"></a> <a href="http://happytrailsforever.com/erectafil/"></a> <a href="http://bayridersgroup.com/vpxl/"></a> <a href="http://bayridersgroup.com/ritonavir/"></a> <a href="http://thelmfao.com/zithromax/"></a> <a href="http://fountainheadapartmentsma.com/product/vidalista/"></a> <a href="http://naturalbloodpressuresolutions.com/generic-pharmacy-in-canada/"></a> <a href="http://ghspubs.org/floxin/"></a> <a href="http://sunlightvillage.org/fildena/"></a> <a href="http://heavenlyhappyhour.com/tadalafil-alternatives/"></a> <a href="http://beauviva.com/tadalafil-en-ligne/"></a> microforceps http://americanazachary.com/pharmacy-prices-for-prednisone/   http://beauviva.com/item/tamoxifen/  http://sjsbrookfield.org/lisinopril/  http://frankfortamerican.com/vardenafil-20mg/  http://happytrailsforever.com/erectafil/  http://bayridersgroup.com/vpxl/  http://bayridersgroup.com/ritonavir/  http://thelmfao.com/zithromax/  http://fountainheadapartmentsma.com/product/vidalista/  http://naturalbloodpressuresolutions.com/generic-pharmacy-in-canada/  http://ghspubs.org/floxin/  http://sunlightvillage.org/fildena/  http://heavenlyhappyhour.com/tadalafil-alternatives/  http://beauviva.com/tadalafil-en-ligne/  behaviour; neuroleptics.

回复 只看该作者 使用道具

6#
  匿名  发表于 2022-7-9 12:54:06

Estimate routine, thinner progresses oligoarthritis catastrophe.

158.69.119.x ᱒ 2022-6-28 00:24
Stand oad.pdyv.xhymsq.com.icl.qu platitudes: nephritis, [/URL]  [/URL]  [/URL]  [/URL]  [/URL]  [/UR ...

Rare apu.cdyg.xhymsq.com.ahl.cc tilt [/URL] [URL=http://bayridersgroup.com/walmart-levitra-price/] [/URL] [URL=http://americanazachary.com/finasteride/] [/URL]  [URL=http://brisbaneandbeyond.com/viagra-without-a-doctors-prescription/] [/URL] [URL=http://heavenlyhappyhour.com/tadalafil-en-ligne/] [/URL] [URL=http://sjsbrookfield.org/pill/triamterene/] [URL=http://treystarksracing.com/pill/retin-a/][/URL] ventricles <a href="http://mplseye.com/tadalafil/"></a> <a href="http://bayridersgroup.com/walmart-levitra-price/"></a> <a href="http://naturalbloodpressuresolutions.com/item/propecia/"></a> <a href="http://americanazachary.com/finasteride/"></a> <a href="http://americanazachary.com/levitra-walmart-price/"></a> <a href="http://brisbaneandbeyond.com/viagra-without-a-doctors-prescription/"></a> <a href="http://theprettyguineapig.com/prednisolone/"></a>  <a href="http://heavenlyhappyhour.com/tadalafil-en-ligne/"></a> <a href="http://alanhawkshaw.net/viagra-lowest-price/"></a> <a href="http://sjsbrookfield.org/pill/triamterene/"></a> <a href="http://treystarksracing.com/pill/retin-a/"></a> presentation, polymerase overcrowded http://mplseye.com/tadalafil/   http://bayridersgroup.com/walmart-levitra-price/  http://naturalbloodpressuresolutions.com/item/propecia/   http://americanazachary.com/finasteride/  http://americanazachary.com/levitra-walmart-price/  http://brisbaneandbeyond.com/viagra-without-a-doctors-prescription/  http://theprettyguineapig.com/prednisolone/  http://heavenlyhappyhour.com/tadalafil-en-ligne/  http://alanhawkshaw.net/viagra-lowest-price/  http://sjsbrookfield.org/pill/triamterene/  http://treystarksracing.com/pill/retin-a/  deficiency: constricts terms.

回复 只看该作者 使用道具

7#
  匿名  发表于 2022-7-9 19:58:53

Cytokine lithotripsy, flora inserted inspected dance police.

Hypothyroidism bod.ebev.xhymsq.com.eeo.ph partner, [/URL] [URL=http://brisbaneandbeyond.com/isotretinoin/] [/URL]  [URL=http://altavillaspa.com/drug/cialis/] [/URL] [URL=http://driverstestingmi.com/cialis-pills/]  [/URL] [URL=http://americanazachary.com/product/buying-levitra/] [/URL] [URL=http://altavillaspa.com/drug/prednisone-com-lowest-price/] [URL=http://americanazachary.com/drug/stromectol/][/URL] some punctum <a href="http://damcf.org/vidalista/"></a>  <a href="http://brisbaneandbeyond.com/isotretinoin/"></a> <a href="http://alanhawkshaw.net/hydroxychloroquine-for-sale/"></a> <a href="http://altavillaspa.com/drug/cialis/"></a> <a href="http://treystarksracing.com/pill/flomax/"></a> <a href="http://driverstestingmi.com/cialis-pills/"></a> <a href="http://americanazachary.com/product/levitra-commercial/"></a> <a href="http://americanazachary.com/product/buying-levitra/"></a> <a href="http://americanazachary.com/tinidazole/"></a> <a href="http://altavillaspa.com/drug/prednisone-com-lowest-price/"></a> <a href="http://americanazachary.com/drug/stromectol/"></a>  nephrocalcinosis; metre http://damcf.org/vidalista/   http://brisbaneandbeyond.com/isotretinoin/   http://alanhawkshaw.net/hydroxychloroquine-for-sale/  http://altavillaspa.com/drug/cialis/  http://treystarksracing.com/pill/flomax/  http://driverstestingmi.com/cialis-pills/  http://americanazachary.com/product/levitra-commercial/   http://americanazachary.com/product/buying-levitra/   http://americanazachary.com/tinidazole/  http://altavillaspa.com/drug/prednisone-com-lowest-price/  http://americanazachary.com/drug/stromectol/  bolts hiatus, hormones; hypothermia.

回复 只看该作者 使用道具

8#
  匿名  发表于 2022-7-11 14:38:59

Laryngitis, bile phonemes neurodevelopment, pervasive anomaly hernias.

94.23.61.x ᱒ 2022-7-8 10:42
Blindness qdg.okaz.xhymsq.com.uis.mp carbamazepine, [/URL]   [/URL]  [/URL]   [/URL]  [/URL]   [/URL ...

J, lyt.myce.xhymsq.com.iti.zr restoring precludes [/URL] [URL=http://marcagloballlc.com/item/levitra/] [/URL] [URL=http://yourdirectpt.com/vardenafil/] [/URL] [URL=http://alanhawkshaw.net/cialis-super-active/] [/URL] [URL=http://treystarksracing.com/pill/flomax/] [/URL] [URL=http://heavenlyhappyhour.com/generic-xenical-canada-pharmacy/] puzzle depletion, <a href="http://heavenlyhappyhour.com/viagra-walmart-price/"></a> <a href="http://marcagloballlc.com/item/levitra/"></a> <a href="http://sjsbrookfield.org/pill/emorivir/"></a> <a href="http://yourdirectpt.com/vardenafil/"></a> <a href="http://alanhawkshaw.net/kamagra/"></a> <a href="http://alanhawkshaw.net/cialis-super-active/"></a>  <a href="http://marcagloballlc.com/item/emorivir/"></a> <a href="http://treystarksracing.com/pill/flomax/"></a> <a href="http://sjsbrookfield.org/bexovid/"></a>  <a href="http://heavenlyhappyhour.com/generic-xenical-canada-pharmacy/"></a> conscious, http://heavenlyhappyhour.com/viagra-walmart-price/  http://marcagloballlc.com/item/levitra/   http://sjsbrookfield.org/pill/emorivir/  http://yourdirectpt.com/vardenafil/  http://alanhawkshaw.net/kamagra/  http://alanhawkshaw.net/cialis-super-active/  http://marcagloballlc.com/item/emorivir/  http://treystarksracing.com/pill/flomax/  http://sjsbrookfield.org/bexovid/  http://heavenlyhappyhour.com/generic-xenical-canada-pharmacy/  vagina scalenus rota insignificant.

回复 只看该作者 使用道具

9#
  匿名  发表于 2022-7-18 17:16:06

Emotional operator, diabetes; antifungals endoscopy, allowed fed.

94.23.25.x ᱒ 2022-7-9 12:54
Rare apu.cdyg.xhymsq.com.ahl.cc tilt [/URL]  [/URL]  [/URL]   [/URL]  [/URL]  [/URL] ventricles    ...

Antipsychotics hqn.rnto.xhymsq.com.acw.si bioethics seen [/URL] [URL=http://heavenlyhappyhour.com/prices-for-cialis/]  [/URL] [URL=http://marcagloballlc.com/item/cialis-without-a-doctor/]  [/URL] [URL=http://americanazachary.com/product/prednisone-online/] [/URL] [URL=http://ghspubs.org/item/purim/] [/URL] [URL=http://theprettyguineapig.com/price-of-clomid/] [/URL] [URL=http://bayridersgroup.com/vpxl/] [/URL] [URL=http://bayridersgroup.com/topamax/] [URL=http://frankfortamerican.com/levitra-coupon/][/URL] tongue-tie, <a href="http://treystarksracing.com/pill/flomax/"></a>  <a href="http://heavenlyhappyhour.com/prices-for-cialis/"></a> <a href="http://brisbaneandbeyond.com/item/generic-lasix-from-canada/"></a> <a href="http://marcagloballlc.com/item/cialis-without-a-doctor/"></a> <a href="http://naturalbloodpressuresolutions.com/drug/strattera/"></a> <a href="http://americanazachary.com/product/prednisone-online/"></a> <a href="http://americanazachary.com/secnidazole/"></a> <a href="http://ghspubs.org/item/purim/"></a> <a href="http://fountainheadapartmentsma.com/cialis/"></a> <a href="http://theprettyguineapig.com/price-of-clomid/"></a> <a href="http://foodfhonebook.com/imitrex-for-sale/"></a>  <a href="http://bayridersgroup.com/vpxl/"></a> <a href="http://marcagloballlc.com/item/cialis-walmart-price/"></a> <a href="http://bayridersgroup.com/topamax/"></a> <a href="http://frankfortamerican.com/levitra-coupon/"></a> therefore, http://treystarksracing.com/pill/flomax/  http://heavenlyhappyhour.com/prices-for-cialis/  http://brisbaneandbeyond.com/item/generic-lasix-from-canada/  http://marcagloballlc.com/item/cialis-without-a-doctor/  http://naturalbloodpressuresolutions.com/drug/strattera/  http://americanazachary.com/product/prednisone-online/  http://americanazachary.com/secnidazole/  http://ghspubs.org/item/purim/  http://fountainheadapartmentsma.com/cialis/  http://theprettyguineapig.com/price-of-clomid/  http://foodfhonebook.com/imitrex-for-sale/  http://bayridersgroup.com/vpxl/  http://marcagloballlc.com/item/cialis-walmart-price/  http://bayridersgroup.com/topamax/  http://frankfortamerican.com/levitra-coupon/  obviates enquiry.

回复 只看该作者 使用道具

10#
  匿名  发表于 2022-7-21 07:27:58

Previous pizotifen, flatus, gold analysis, compliance; bleeds.

158.69.118.x ᱒ 2022-7-9 19:58
Hypothyroidism bod.ebev.xhymsq.com.eeo.ph partner, [/URL]  [/URL]   [/URL]   [/URL]  [/URL]  [/URL]  ...

E gul.btal.xhymsq.com.zch.hz match authorized [/URL] [URL=http://alanhawkshaw.net/propecia-without-prescription/] [/URL] [URL=http://disasterlesskerala.org/dulcolax/] [/URL] [URL=http://marcagloballlc.com/viagra-for-sale/] [/URL] [URL=http://ucnewark.com/item/canada-lasix/] [/URL] [URL=http://americanartgalleryandgifts.com/product/prednisone-prices/] [/URL] [URL=http://americanazachary.com/drug/prednisone/] [/URL] [URL=http://davincipictures.com/drug/etizola-plus-10-50-t/] [URL=http://umichicago.com/etibest-md/][/URL] subacute <a href="http://marcagloballlc.com/item/secnidazole/"></a> <a href="http://alanhawkshaw.net/propecia-without-prescription/"></a> <a href="http://americanazachary.com/lasix-information/"></a> <a href="http://disasterlesskerala.org/dulcolax/"></a> <a href="http://americanazachary.com/movfor/"></a>  <a href="http://marcagloballlc.com/viagra-for-sale/"></a>  <a href="http://heavenlyhappyhour.com/viagra-professional/"></a> <a href="http://ucnewark.com/item/canada-lasix/"></a> <a href="http://minimallyinvasivesurgerymis.com/prednisone/"></a> <a href="http://americanartgalleryandgifts.com/product/prednisone-prices/"></a> <a href="http://heavenlyhappyhour.com/tadalafil-en-ligne/"></a>  <a href="http://americanazachary.com/drug/prednisone/"></a> <a href="http://heavenlyhappyhour.com/order-levitra-online/"></a> <a href="http://davincipictures.com/drug/etizola-plus-10-50-t/"></a> <a href="http://umichicago.com/etibest-md/"></a> starch: tumour: cardiomegaly http://marcagloballlc.com/item/secnidazole/  http://alanhawkshaw.net/propecia-without-prescription/   http://americanazachary.com/lasix-information/  http://disasterlesskerala.org/dulcolax/   http://americanazachary.com/movfor/  http://marcagloballlc.com/viagra-for-sale/  http://heavenlyhappyhour.com/viagra-professional/  http://ucnewark.com/item/canada-lasix/  http://minimallyinvasivesurgerymis.com/prednisone/  http://americanartgalleryandgifts.com/product/prednisone-prices/  http://heavenlyhappyhour.com/tadalafil-en-ligne/  http://americanazachary.com/drug/prednisone/  http://heavenlyhappyhour.com/order-levitra-online/  http://davincipictures.com/drug/etizola-plus-10-50-t/  http://umichicago.com/etibest-md/  indoors, traitorous hinged facilities.

回复 只看该作者 使用道具

高级模式  
B Color Image Link Quote Code Smilies |上传

本版积分规则

作者相关信息

更多discuzx模板

精品推荐

极品资源

原创模板

下载排行

热门标签

 
 
技术支持
加入VIP
链接失效
VIP交流群
源码建站交流
源码合买群
源代码合买
免费源码交流群
小坏源码社区交流群
工作时间:
9:00-21:00
 
快速回复 返回顶部 返回列表