# 如何用自定义图标替换现有SVG图标？

**URL:** <https://meta.discourse.org/t/how-to-replace-an-existing-svg-icon-with-a-custom-one/277743>\
**Category:** Development\
**Created:** [2021 年3 月 14 日 17:18 UTC](https://meta.discourse.org/t/how-to-replace-an-existing-svg-icon-with-a-custom-one/277743 "2021-03-14T17:18:47Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

作者： ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)\
发布日期： [2021 年3 月 15 日 14:07 UTC](https://meta.discourse.org/t/how-to-replace-an-existing-svg-icon-with-a-custom-one/277743/3 "2021-03-15T14:07:30Z")

</div>

> [@Phlipups](#):
>
> 在 SVG 图标子集中，我添加了 fa-pig 和 fal-pig，但预览时“点赞”图标显示为空白。我推测这是因为实际上并未安装 Pig 图标。于是我尝试了本应免费的 piggy-bank 图标，并将其添加到图标子集中，但“点赞”图标仍然显示为空白。

`piggy-bank` 图标应该可以正常工作，但您需要在 SVG 图标子集站点设置以及 JS 覆盖函数中，以不带任何前缀的方式添加它。

Pro 图标未包含在核心中，因此对于仅限 Pro 的 `pig` 图标，您可以使用 Jay 上面建议的插件，或者自行创建精灵图。请务必查看 OP 中链接的示例 SVG 精灵图文件，该精灵图需要具有特定的结构，包含符号（symbols）和 ID（然后在 JS API 调用中使用该 ID）。

---

_[View the full topic](https://meta.discourse.org/t/how-to-replace-an-existing-svg-icon-with-a-custom-one/277743)._