Elegantly Using Alibaba's Icon Font Library in Hexo
- In the
injectconfiguration section of[Blogroot]_config.butterfly.yml, import the online resources for Unicode and Font-class:
2) Open [Blogroot]/themes/butterfly/source/css/custom.css and input the following content:
- Add a custom tag. Create a new file
iconfont.jsin the directory[Blogroot]/themes/butterfly/scripts/tag/, then open[Blogroot]/themes/butterfly/scripts/tag/iconfont.jsand input:
4) After running hexo cl && hexo g, you can use the custom tag to insert icons.
Syntax Example
Parameter Description
| Parameter | Description |
|---|---|
icon-xxxx | The icon's font-class, which can be looked up and copied from the font-class reference method within your project on Alibaba's Icon Font Library |
font-size | Icon size; enter a number directly, unit in em, default value is 1em |