Impreza主题基础操作

主题选项

116 views 2019年2月24日 2019年3月4日 imaiko 1

一般

2261.jpeg

维护模式

打开此选项将您的网站置于维护模式。将显示所有未登录访客的特定页面(从页面列表中选择)。

2004.jpeg

启用“503服务不可用”状态

打开此选项可将服务器设置为发送503标题(服务不可用),这可能有助于避免由搜索引擎机器人编制此维护页面的索引。仅在短时间内使用此选项。

网站图标

选择一个将用作您的网站的浏览器和应用程序图标的图像。图标必须是方形的,并且至少有512个像素宽和高。这个选项只是重复WordPress的功能,以更好的方便。

预加载器屏幕

选择一个预定义的预加载器或将其禁用。

圆角

用下一个选项选择角落外观。

链接下划线

如果您希望在悬停时为文字链接加下划线,请启用此选项。

键盘辅助功能

向元素添加突出显示,以指示其重点状态。

“返回页首”按钮

启用此选项以显示该按钮,该按钮允许将页面滚动回顶部并自定义其外观:

2003.jpeg

Google Maps API密钥

此API密钥是2016年6月22日之后创建的域所必需的。了解API密钥

支持自定义帖子类型

您应该创建自定义帖子才能显示此选项(我们建议使用自定义帖子类型UI插件来轻松创建自定义帖子)。

网站布局

2165.jpeg

响应式布局

打开此选项以启用响应式布局,使您的布局适合在不同设备(台式机,平板电脑和手机)上观看。

当响应行为被停用时,主题会在所有设备上显示页面的所有区域和元素的固定宽度,当屏幕宽度小于最大值,您还应该设置启用移动布局

网站布局

1953.jpeg

宽布局 盒装布局
1383.jpg 1384.jpg

一旦选择了Boxed布局,您可以设置Body Background ColorBody Background Image:

 

2036.jpeg

布局宽度

看看下一张截图,可以更好地理解布局,您可以设置主站点区域的宽度:

  1. 网站画布宽度
  2. 网站内容宽度
  3. 内容宽度
  4. 边栏宽度

1195.jpg

列堆叠宽度

当屏幕宽度小于此值时,一行内的所有列成为单个列。

影响禁用宽度

当屏幕宽度小于此值时,以下选项被禁用:

  • 行中的背景视频
  • 行和标题栏中的背景图像的视差效果
  • 列和单个图像元素的动态外观
  • 点击组合元素的图块,在弹出窗口中打开投资组合页面

行高度默认

为整个网站中的所有行设置默认行高值。

颜色

选择一种预定义的颜色方案:

2242.jpeg

或者根据其中一个预定义方案(通过更改现有值)创建一个新的方案,并保存它:

2243.jpeg

颜色值的含义

2241.jpeg

  • 背景颜色 – 所有网站页面的默认背景颜色
  • 备用背景颜色 – 用于所有表单中的输入字段,用于投资组合和博客中的“加载更多”按钮,用于投资组合过滤器栏,导览和标签标题背景以及常规定价表头
  • 边框颜色 – 所有元素的默认边框颜色
  • 标题颜色 – 所有文本标题的默认颜色
  • 文本颜色 – 所有网站页面的默认文本颜色
  • 链接颜色 – 文字链接的颜色
  • 链接悬停颜色 – 悬停时文本链接的颜色
  • 主要颜色 – 主要重点颜色,用于许多内容元素
  • 辅助颜色 – 辅助重音颜色,通常用于内容元素的悬停状态
  • 褪色元素颜色 – 用于贴子元素(日期,类别,标签,作者等),面包屑,标签云链接,一些图标

替代内容的颜色的含义相同内容的颜色,只是位于行或标题栏与替代内容的颜色项目:

1203.jpg

如何使用调色板?

转到Impreza>主题选项>颜色,选择所需颜色,然后单击加号图标将其添加到调色板:

2247.jpeg

添加颜色后,您可以将它们应用于主题选项,标题生成器网格布局编辑器,页面选项,WPBakery页面生成器元素中的其他颜色输入

2250.jpeg

对于文本编辑器:

2249.jpeg

如何应用页脚颜色?

将相应的行颜色样式指定给页脚行的行设置:

1-1aXSNS.jpeg

标题栏

标题栏是所有网站页面的特殊区域,其中始终包含页面标题,并可能包含面包屑页面描述。标题栏与页面内容区域无关,不能由内容元素填充。

您可以为页面,投资组合页面,博客文章,存档和搜索结果页面,WooCommerce商店和产品页面全局自定义标题栏外观。此外,您可以通过页面选项单独为每个页面定制标题栏外观。

2147.jpeg

默认值

为标题栏设置默认设置,它们将应用于所有常规页面和自定义帖子(由“自定义帖子类型UI”或其他任何添加自定义帖子的第三方插件创建)。

标题栏大小

选择预定义的标题栏大小之一:

  • 巨大

标题栏颜色风格

选择一种预定义的颜色样式:

  • 内容颜色
  • 备用内容颜色
  • 主要bg&白色文本
  • 中学bg&白色文本
  • 顶部页脚颜色
  • 底部页脚颜色

所有这些颜色样式可以在主题选项>颜色中更改。

面包屑

选择是否显示或隐藏面包屑。

背景图像

我们建议上传1920px宽的原始图片,以使它们在所有设备上看起来不错。一旦你添加了一个图像,点击设置图像按钮,会出现其他选项:

2030.jpeg

背景图像大小

选择如何延伸背景图片:

  • 填充区域
  • 适合区域
  • 初始

背景图片重复

选择背景图像将如何重复:

  • 重复
  • 水平
  • 垂直
  • 没有

背景图像位置

设置背景图像的起始位置,此时有9个可用值。

视差效应

选择背景图像的预定义视差效果之一:

  • 没有
  • 垂直视差
  • 垂直反转视差
  • 水平视差
  • 固定

覆盖颜色

选择所需的覆盖图颜色及其不透明度,它会出现在背景图像上方。

组合页面

显示标题栏

选择是否在投资组合页面上显示或隐藏标题栏。

使用默认值

禁用此选项可分别自定义标题栏外观,否则将从默认区域进行设置

帖子

显示标题栏

选择是否在博客文章上显示或隐藏标题栏。

使用默认值

禁用此选项可分别自定义标题栏外观,否则将从默认区域进行设置

标题栏标题

设置标题栏标题,它会显示在所有博客文章中。

目前,所有博客文章仅在标题栏中显示特定(由您设置)标题,以避免在同一页面上重复发布标题。

存档,搜索结果页面

显示标题栏

选择是否在存档,搜索结果页面上显示或隐藏标题栏。

使用默认值

禁用此选项可分别自定义标题栏外观,否则将从默认区域进行设置

商店和产品页面

显示标题栏

选择是在商店和产品页面上显示还是隐藏标题栏。

使用默认值

禁用此选项可分别自定义标题栏外观,否则将从默认区域进行设置

页脚

自Impreza 4.6以来,您可以将所需的页脚分配给页面,投资组合,帖子,商店,存档和搜索结果页面。

2151.jpeg

转到Impreza>页脚查找所有页脚。使用WPBakery Page Builder编辑它们 并分配合适的颜色样式:

2061.jpeg

字体选项

正则文本

1829.jpeg

选择一个默认的网页安全组合(由操作系统安装),这些字体不需要加载。或者选择一种自定义字体,该字体将从Google字体中加载。

1260.jpg

选择Google字体之一后,您可以设置其他字体重量。

1264.jpg

分别设置桌面和移动设备的字体大小。

1265.jpg

标题

1259.jpg

选择一个默认的网页安全组合(由操作系统安装),这些字体不需要加载。或者您可以选择自定义字体,该字体将从Google字体加载。

1260.jpg

选择Google字体之一后,您可以设置其他字体重量。

1261.jpg

分别设置台式机和移动设备的字体大小。此外,您可以设置字体间距,字体重量,并选择每个标题单独显示标题文本的方式(全部大写,斜体或按原样)。

2006.jpeg

主菜单文本

为主菜单标签选择一种字体。

1266.jpg

然后你可以自定义字体重量。

1267.jpg

在相关的标题元素选项中设置主菜单字体大小。

子集

为Google字体选择字符子集(对于特殊字符正确呈现可能很有用)。

1269.jpg

注意:某些字体不支持特定的子集。

纽扣

您可以设置所有网站页面上按钮的全局外观。

2169.jpeg

文本样式

选择您的按钮文字是大写还是斜体。

默认字体大小

为所有按钮设置默认字体大小,它将用于下面的相对值。编辑时可以更改单独按钮的字体大小(或具有按钮的元素)。

字体重量

为所有按钮设置字体重量。

字母间距

为所有按钮设置字母间距(字母之间的距离)。

使用来自

选择哪个字体系列将应用于所有按钮,它将采用“ 版式”选项卡中的值。

相对高度

设置所需的按钮高度,取决于按钮字体大小值。

相对宽度

设置所需的按钮宽度,取决于按钮字体大小值。

角半径

设置角点半径,取决于按钮字体大小值。

影子

应用阴影并设置其大小,取决于按钮的字体大小值。

悬停风格

当您将鼠标悬停在按钮上时,选择应用于按钮的效果。

悬停的阴影

应用悬停时在网站按钮下方显示的阴影和大小。

投资组合

2236.png

中级面包屑页面

将任何页面设置为中间面包屑。标题栏中仅提供面包屑。

评论

该选项允许用户对投资组合页面进行评论。当禁用此选项时,即使在某些投资组合页面上单独启用评论,也会一次隐藏所有投资组合页面上的评论。

上一个/下一个导航

此选项可以在屏幕两侧的前/后组合页面之间进行导航(请参阅此演示网站)。

反转上一个和下一个

该选项交换导航元素的位置。

在类别中导航

此选项可以在同一类别内的投资组合页面之间导航。

投资组合页面S ##

  • 该选项允许更改投资组合页面的slu g。
    例如:默认投资组合页面具有类似yoursite.com/portfolio/project-one/的 URL ,通过此选项可以更改URL,如yoursite.com/works/project-one/
  • 您可以将此栏位留空,以完全移除此slu,,网址将显示为yoursite.com/project-one/

投资组合类别弹头

该选项允许更改投资组合类别的slu g。

博客

帖子

2155.jpeg

特色图片布局

为所有帖子页面选择精选图片版式。编辑时可以将其设置为单独的特定帖子。

特色图片尺寸

选择精选图片大小。

邮政元素

选择将显示哪些贴文元素。

分享按钮

打开此选项以启用将显示在帖子内容下方的共享按钮。选择要显示的按钮和预定义的按钮类型之一:

简单

1754.jpeg

固体

1755.jpeg

概述

1753.jpeg

作者信息

打开此选项以显示包含作者信息的框。

1283.jpg

上一个/下一个导航

打开此选项以显示前一个/下一个帖子的链接。

2011.jpeg

在帖子内容下方

1284.jpg

屏幕的侧面

2012.jpeg

相关文章

相关帖子是具有相同标签的帖子,此时相关帖子在每个页面载荷上随机显示。您可以选择相关帖子的布局:

紧凑
1985.jpeg

标准
1984.jpeg

博客主页,档案和搜索结果页面

  • 博客主页是在设置>阅读中选择的页面作为您的最新帖子帖子页面:1300.jpg
  • 归档页面用于发布类别,月份归档,发布标签,发布作者和附件
  • 搜索结果页面在使用您网站上的任何搜索字段后显示

所有这些博客页面都有相同的选项,如下所述:

2013.jpeg

将帖子显示为

您可以为Classic,Flat,Cards,Tiles博客布局启用砌体模式。

布局

选择博客主页的布局

图像大小

选择缩略图大小。

帖子栏目

选择博客布局的列数。

帖子内容

选择内容进行后期预览。

职位元素

选择将显示哪些贴文元素。

分页

选择分页类型。

更多选项

2014.jpeg

摘录长度

在摘录中的词的输入量。如果您想显示帖子的全部内容,请将此栏留空。

阅读更多按钮样式

选择按钮的实体或轮廓样式。

阅读更多按钮颜色

将其中一个预定义的颜色应用于按钮。

阅读更多按钮尺寸

指定所需的按钮尺寸(例如:26px,1.3em,200%)。

博客响应行为

该选项会更改所有博客列表中的一系列帖子。它也适用于Carousel模式。

2157.jpeg

产品网格样式

为所有页面选择产品风格。

标准

1845.jpeg

现代

1846.jpeg

新潮

1847.jpeg

产品网格列

在一行产品网格中选择数量的列(从1到6)。该选项适用于全球所有网站页面。

792.png

相关产品数量

在产品页面和购物车页面上选择相关产品数量(从1到6)。

794.png

购物车页面样式

在购物车页面上选择页面块的外观:

标准

这种风格适用于有长词的语言(如德语)。

1828.jpeg

紧凑

1827.jpeg

目录模式

打开此选项可禁用通过在所有网站页面上删除“添加到购物车”按钮来购买产品的功能。

高级

主题模块

如果您不打算在您的网站上使用Portfolio或Testimonials模块,请关闭这些选项。

2167.jpeg

网站性能

2168.jpeg

推迟Google字体loading 

打开此选项可强制在页面内容之后加载Google字体文件。这应该会改善Google PageSpeed Insights测试的结果,并可能会提高Google的排名。

将jQuery脚本移动到页脚

打开这个选项来设置默认的WordPress jQuery脚本,在页面内容之后加载。这将提高页面加载速度。

请注意,如果其中一个3D派对插件在<head> </ head>部分中请求了jQuery库,那么脚本将不会移动到页脚。例如,要使此选项适用于Slider Revolution,您应该将其脚本移动到页脚,参阅本文以获取详细信息。

禁用jQuery迁移脚本

打开这个选项禁用jquery-migrate.min.js,这会提高页面加载速度,但可能会导致与某些3d插件的兼容性问题。

动态加载主题JS组件

打开此选项以设置要加载的Impreza主题JavaScript文件(gmaps.min.js,jquery.isotope.js,jquery.magnific-popup.js,jquery.royalslider.min.js,owl.carousel.min.js)动态地通过AJAX XHR请求,并且如果他们被特定元素请求,而没有额外的外部请求。这将提高页面加载速度,以及SEO排名。

禁用WPBakery页面生成器的额外功能

关闭此选项以启用Grid Builder和WPBakery Page Builder的一些默认内容元素(请查看下面的列表)。这些功能将在每个网站页面上加载额外的JS和CSS文件,因此它将减少页面加载速度。

以下内容元素在Impreza中默认处于禁用状态:

  • 部分
  • 图标
  • Facebook喜欢
  • Twitterme按钮
  • Google+按钮
  • Pinterest的
  • 常问问题
  • 可分页容器
  • VC按钮
  • 职位滑块
  • Flickr小工具
  • VC进度条
  • 饼形图
  • 邮政网格
  • 媒体网格
  • 后砌体网格
  • 砌体媒体网格

优化CSS大小

主题选项CSS代码可以以两种方式存储:

  • 在一个单独的CSS文件中,位于yourwebsite.com/wp-content/uploads/us-assets/文件夹中
  • 每个网站页面的HTML结构中的<head>部分

打开这个选项只加载一个CSS文件。您可以禁用未使用的组件以减小文件大小。这将改善页面加载速度。

2170.jpeg

每次点击“保存更改”按钮时,CSS代码都会被缩小并生成。

图像尺寸

设置您自己的图像大小将用于主题元素,以提高页面加载速度。
阅读图像大小

1972.jpeg

自定义代码

自定义CSS 

该字段允许通过CSS自定义您的网站外观(或修复一些小问题)。该字段的代码将被添加到主题选项生成样式的末尾。

自定义HTML 

此字段通常用于Google Tracking代码或其他跟踪代码(WebMaster工具代码)。此外,此字段允许将自定义代码(HTML,jQuery,原始JavaScript)插入每个网站页面的页脚部分(正好在关闭HTML结构的</ body>标记之前)。

管理选项

2160.jpeg

重置主题选项

您可以通过单击重置按钮来重置所有主题选项,重置它们时要小心,如果您没有进行备份将无法恢复它们

备份主题选项

在对主题选项进行任何更改之前或重新设置之前,运行现有主题选项的备份,在其他情况下,我们建议进行完整站点备份

传输主题选项

选择文本区域中的所有代码(通过按下键盘上的CTRL + A),复制它,然后将复制的代码插入到另一个站点,或者将其保存为文本文件。请注意,它仅适用于相同的Impreza版本。

帮到你了吗?