Impreza主题高级设置

应用自定义CSS,HTML和JavaScript

230 views 2019年2月24日 2019年3月4日 imaiko 0

页面样式自定义指南

你需要有基本的CSS知识才能使用指南。否则,您可能需要先学习CSS。

您可以使用CSS语言创建特定的样式修改

在哪里写网页的CSS代码#

最有可能的是,您正在使用Impreza附带的WPBakery Page Builder(Visual Composer)插件。点击WPBakery Page Builder编辑器顶部的特殊按钮,插入相关代码:

2187.jpeg

将代码插入到显示的字段中,保存更改并预览页面/帖子以查看更改。

1461.png

造型特定的元素#

几乎每个元素都有一个称为“Extra class name”的特殊字段,可用于识别页面上的此特定元素:

1462.png

只需输入一些独特的类名称,然后,您就可以为其添加自定义CSS样式:

1463.png

造型特定元素的内部标签#

假设我们想在这个按钮的内部设计一个星形图标:

1464.png

我们需要编辑它并添加一些独特的类名,如下所示:

1465.png

在FireFox中打开页面(如果您没有FireFox,请安装它 – 至少为了开发目的)。FireFox需要FireBug插件(如果你没有它,可以在这里安装)。在具有自定义类名称的元素中查找所需的标记:

1466.png

所以我们可以像这样写一个相关标签的样式:

1467.png

要实现这样的事情:

1468.png

应用自定义CSS,HTML和JavaScript

全局自定义CSS #

要通过CSS自定义主题,您可以使用位于Impreza >主题选项>自定义代码>自定义CSS上的“自定义CSS”字段。来自该字段的代码将被添加到主题选项生成的样式中,放在所有其他主题CSS规则之后。

1853.jpeg

为特定页面定制CSS #

请阅读“  页面样式自定义指南”  了解详细信

全球自定义HTML和JavaScript #

当您想要为网站的所有页面添加一些脚本或其他元素时,可以使用位于Impreza>主题选项>自定义代码>自定义HTML中的 “自定义HTML”字段。

1854.jpeg

此字段中的代码将添加到您网站的页脚部分。您可以在<script> </ script>标记中使用JavaScript代码。此外,您可以将Google Analytics或其他跟踪代码添加到此字段中。

为特定页面定制HTML和JavaScript #

您可以使用Raw HTML和Raw JS元素,通过WPBakery Page Builder(以前称为Visual Composer)将自定义代码附加到特定页面。

1562.jpg

帮到你了吗?