[Slider Revolution 6]Slider Revolution支持多种Google字体,您也可以使用应用自定义网络字体。

[Slider Revolution 6] Slider Revolution supports a wide range of Google Fonts. But you can also use apply a custom webfont.Slider Revolution
这篇文章约3分阅读完。
  • 相关话题
  • 添加/编辑图层
  • 图层样式
  • 自定义CSS / JS

特别说明:

如果您希望使用的Webfont已经被WordPress主题加载,请跳至   下面的第2 部分或第3部分。

第1部分

在此示例中,我们将使用FontSquirell中的  Open Sans字体。访问该链接后,单击“ Webfont工具包” 选项卡,然后单击“ 下载@ font-face工具包” 按钮:

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

接下来,解压缩下载的文件,然后打开名为How_to_use_web_fonts.html 的html文件,并查看本文档中的信息。

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

接下来,单击下载的webfont 文件夹,然后单击opensans_bold_macroman 文件夹。在此文件夹中,您将看到以下字体文件:

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

接下来,使用ftp程序将字体上载到您的网站。对于此示例,我们将在wp-content 目录中创建一个名为webfonts 的新目录。因此,字体将在此处通过ftp上传:

wp-content / webfonts /

接下来,在文本编辑器中打开“ stylesheet.css”文件:

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

并将网址修改为绝对网址,以便从wp-content / webfonts / 目录中加载它们。这是一个例子:

@ font-face {
font-family:’open_sansbold’;
src:url(’http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot’);
src:网址(’http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.eot?#iefix’)格式(’embedded-opentype’),
网址(’http:// www .site.com / wp-content / webfonts / OpenSans-Bold-webfont.woff’)格式(’woff’),
网址(’http://www.site.com/wp-content/webfonts/OpenSans-Bold- webfont.ttf’)format(’truetype’),
url(’http://www.site.com/wp-content/webfonts/OpenSans-Bold-webfont.svg#open_sansbold’)format(’svg’);
font-weight:正常;
字体样式:正常;

}

接下来,将此CSS复制到计算机的剪贴板中,并将其粘贴到模块的“自定义CSS”部分中。

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。
[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

第2部分

要将字体正式应用于您的文本图层之一,请在编辑阶段选择“图层”,然后在“属性”部分中添加一个唯一的类。

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

然后打开自定义CSS模式,并使用“!important”声明将字体应用于类。

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。
[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

第三部分

导航到“ 全局设置”,然后找到“ 在编辑器中启用自定义字体选择 ”选项

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

在文本框中插入“字体家族”名称。

示例:CustomA,CustomB

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

然后,“字体家族”将出现在“文本层”>“样式”>“字体家族”下拉列表中

[Slider Revolution 6] Slider Revolution支持多种Google字体。 但是,您也可以使用应用自定义网络字体。

评论

复制标题和 URL