Flaticons 没有出现在 WordPress 上

Question

我几乎完成了将 HTML 网站转换为 WordPress 的工作，但我无法工作。我只是在创建一个新主题来切换网站。 Here is the link to see what it should look like，在 about 部分的正下方，有三个图标未显示。这是我网站的链接，zekemaurer.com。

这里是代码。

<div class="col-md-4">
                    <div class="single-service txt2_is_show">
                        <div class="icon"><span class="flaticon-web-design"></span></div>
                        <div class="srvc-content">
                            <h4>Realtor</h4>
                            <p>I ought to just try that with my boss; I'd get kicked out on the spot. But who knows, maybe that would be the best</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="single-service txt2_is_show">
                        <div class="icon"><span class="flaticon-settings"></span></div>
                        <div class="srvc-content">
                            <h4>Investor</h4>
                            <p>I ought to just try that with my boss; I'd get kicked out on the spot. But who knows, maybe that would be the best</p>
                        </div>
                    </div>
                </div>

如何让图标显示在我的 wordpress 网站上？

Answer 1

您在示例网站中缺少assets/css/flaticon.css。

具体来说，这个 CSS 你可以转储到 style.css 的末尾

/*

    Flaticon icon font: Flaticon
    Creation date: 23/10/2017 08:34
    */

@font-face {
  font-family: "Flaticon";
  src: url("../fonts/Flaticon.eot");
  src: url("../fonts/Flaticon.eot?#iefix") format("embedded-opentype"),
       url("../fonts/Flaticon.woff") format("woff"),
       url("../fonts/Flaticon.ttf") format("truetype"),
       url("../fonts/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: "Flaticon";
    src: url("./Flaticon.svg#Flaticon") format("svg");
  }
}

[class^="flaticon-"]:before, [class*=" flaticon-"]:before,
[class^="flaticon-"]:after, [class*=" flaticon-"]:after {
    font-family: Flaticon;
    font-size: 20px;
    font-style: normal;
    margin-left: 0px;
}

.flaticon-play-button:before { content: "\f100"; }
.flaticon-adobe:before { content: "\f101"; }
.flaticon-settings:before { content: "\f102"; }
.flaticon-web-design:before { content: "\f103"; }