专注于外贸建站,分享WordPress建站和Elementor教程

Elementor的全局样式与设置

更新日期:2020-09-23

本篇教程将介绍Elementor网页编辑器的全局样式与设置的常用功能,譬如设置全局的字体、颜色、页面内容宽度、元素默认间距等等。

功能入口:在用Elementor编辑页面时,点击左上角的elementor style setting 2 - Elementor的全局样式与设置按钮即可进入下图中的全局样式与设置面板。

全局样式

elementor-style-setting
  • 默认颜色:用于设置主要、次要、正文文本和强调文本的颜色
  • 默认字体:用于设置主要和次要标题,正文文本和强调文本的字体及字体粗细

建议不在这里设置默认颜色和默认字体,将默认颜色和默认字体都禁用,直接使用紧接着的主题样式功能,避免二者混用造成的混乱感。

  • 主题样式:可设置各种元素的默认样式,例如背景,标题,按钮,图像和表单字段。这些设置将覆盖主题自带的样式设置,从而使您可以使用Elementor为非Elementor构建的元素设置样式。默认情况下,这里的样式只会应用于非Elementor元素, 例如WooCommerce结帐字段,Contact Form 7标签等等。你也可以强制将主题样式设置应用于Elementor内置的元素,只需要禁用Elementor的默认颜色和字体,主题样式的详解点这里

设置

全局设置

样式

除了这里可以设置样式,也可以在网站后台》Elementor》设置中进行设置

elementor-style-setting-3

  • 一般默认字体:如果在主题中自定义的字体不可以用,或者禁用了谷歌、elementor字体,那么就会用这个字体作为后备
  • 内容宽度:用于设置网页内容区域的默认宽度,默认值是1140px,当你想网站页面更宽一点或更窄一些,就调这里。
  • 小工具间隔:可以理解为元素快之间的间距,默认是20px
  • 拉伸部分以适用:原文是Stretched Section Fit To,是指在elementor编辑时,我们常用到的setion的宽度拉伸到此处输入框的元素选择器宽度,默认是body,基本不用改这里
  • 页面标题选择器:这里是服务于隐藏页面标题功能的,如果你的主题的页面标题的样式选择器不是entry-title,那么你就需要更改此处了,如果你用的hello elementor主题,此处也不用改;只有当你发现使用隐藏标题功能不生效时,才需要考虑修改这里。

灯箱

可以理解为图片的弹出窗,如下图所示,左侧为灯箱的配置,右侧为灯箱效果,图中的数字与左侧设置是逐一对应的

elementor lightbox 1 1 - Elementor的全局样式与设置
  • 图像灯箱效果:滑动开关以全局启用或禁用灯箱
  • 1.计数器:用于控制是否显示图片统计数量,通常用于相册
  • 2.全屏:用于控制是否提供全屏功能按钮
  • 3.缩放:用于控制是否提供缩放功能按钮
  • 4.分享:用于控制是否提供分享功能按钮,譬如分享到Facebook、twitter、Pinterest、下载图片。
  • 5.标题:用于设置图片下方的标题文案显示什么内容,选项有:没有内容、图片标题、图片描述、字幕(caption)、图片ALT
  • 描述:功能同上,你可以对图片显示两种文案,这是第二种
  • 6.背景颜色:用于设置图片周围的背景色
  • 7.用户界面颜色:这里的汉化不大好,实际是控制按钮或统计数字的颜色,譬如右上角的4个按钮、翻页按钮等等。
  • 8.用户界面悬停颜色:这里是控制鼠标停留在按钮或统计数字时的显示颜色
  • 9.文本颜色:用于控制标题和描述的颜色
  • 10.工具栏图标大小:用于控制右上方四个按钮的大小
  • 11.导航图标大小:用于控制翻页图标的大小

其他

接下来回到初始界面,剩下几个功能都比较简单了

elementor-style-setting-4
elementor-preferences
  • 仪表板设置:点击可链接到Elementor设置页面。
  • 关于Elementor:链接到Elementor.com
  • 首选项
    • UI主题:用于控制Elementor编辑器的界面风格,有明亮、黑暗模式,也可以使用“自动检测”将其与电脑设备的设置保持同步。
    • 编辑控件:原翻译叫做开始编辑,实际上英文是editing handles,翻译得不大恰当,它的作用是:用于控制鼠标悬停于元素时,是否显示元素的其他编辑控件,譬如复制元素功能。
    • 在编辑器中开启灯箱:用于控制在编辑状态下是否启用图片的灯箱功能。
  • 搜索:可以快速查找并链接到其他页面进行elementor编辑,也可以用它创建新的页面、模板;
  • 查看页面:在浏览器中以实时模式打开当前页面
  • 退出到仪表板:退出当前页面的WordPress默认编辑器状态下

相关问题

如何禁用默认字体和默认颜色

  1. 进入 Elementor > 设置 >  一般 页面中 
  2. 勾选两个禁用默认字体,点击保存即可
elementor%E7%BC%96%E8%BE%91%E5%99%A8%E6%95%99%E7%A8%8B 35 - Elementor的全局样式与设置

本文就到此结束啦~ヾ( ̄▽ ̄)Bye~Bye~

点赞
0 / 5 0

Your page rank:

教程 分类

发表评论

邮箱地址不会被公开。 必填项已用*标注

Hi~当你点击本站中的主机、主题、插件的链接前往购买后,我将获取一些佣金,这是我撰写建站教程的主要收入~希望也能得到你的支持,比心( •̀ ω •́ )y

Copyright © LOYSEO.COM — 专注提供外贸网站建设 · 外贸建站 · 外贸网站制作 与 外贸建站教程

LOYSEO
微信扫一扫