如何查找图形文件来编辑社交图标
如何查找图形文件来编辑社交图标
提问于 2015-11-23 07:44:48
我使用了一个名为Divi的WordPress主题。这不是一个WordPress问题。有许多提供的社交媒体图标，但我需要一个Soundcloud图标，但没有提供。我不明白这些图标是如何填充页面的，因为它们看起来不是图形，而是一种字体？然而，我无法从源代码中分辨出发生了什么(缺乏经验)。
我想要做的是添加一个我设计的图标，或者替换一个现有的图标。如果我应该在我的文件中查找实际的图标，有人能帮我指明方向吗？
你可以在这里看到一个实时的网站，图标在右上角：http://rattletree.com/wordpress2/
开发代码中的Facebook图标是这样的：
<ul class="et-social-icons">
<li class="et-social-icon et-social-facebook">
<a href="#" class="icon">
<span>Facebook</span>
</a>
</li>
</ul>css有这样的功能：
.et-social-facebook a.icon:before {
content: "\e093";
}
#top-header .et-social-icon a {
font-size: 14px;
}这让我认为这是一种字体，但我不知道如何或在哪里可以编辑该字体？谢谢你的帮助！
回答 2
Stack Overflow用户
发布于 2015-11-23 08:30:27
这看起来像您正在使用的字体包：
http://www.elegantthemes.com/blog/resources/elegant-icon-font
它看起来没有soundcloud的图标，但你可以使用云图标：
因此，只需将此代码添加到样式表中：
.et-social-soundcloud a.icon:before {
content: "\e002";
}另外，这里有一个教程：https://www.elegantthemes.com/blog/resources/how-to-use-and-embed-an-icon-font-on-your-website
Stack Overflow用户
发布于 2015-11-23 15:32:00
要添加设计的图标，请将以下代码添加到样式表中。
#top-header .et-social-icon.soundcloud a {
width: 15px;
height: 25px;
}
.soundcloud a.icon:before {
content: "";
background: url('https://placehold.it/15x25') 100% 100% no-repeat;
height: 100%;
width: 100%;
display: inline-block;
}确保您创建了一个图标，将图标图像添加到主题文件夹，并更新上述代码中的url以指向该图像。
另外，在WordPress后端的菜单中添加类soundcloud。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33861663
复制相关文章
相似问题
腾讯云开发者
