WordPress全局样式:用户可以更好地控制网站的布局和设计

为了实现FSE,WordPress正在开发使用块目录、块模式和块主题的块编辑器。这些主题需要两个组件来工作:模板和全局样式。模板听起来很熟悉,但全局样式是什么?bluehost美国主机为您分享:

WordPress全局样式101

全局样式帮助用户更改其网站的整体风格。避免让用户逐个地编辑每一个块或页面。它给Gutenberg和WordPress提供了更高级别的定制能力,扩展了全站编辑功能。

使用全局样式,用户可以更好地控制网站的布局和设计。主题开发人员可以更自由、更具功能性地来设计和样式化块。推荐阅读:《WordPress未来五大计划更新:清除垃圾邮件,重新激活投稿》

在此之前,在WordPress的经典编辑器上编辑网站的网页设计师使用PHP添加颜色和调整字体大小。使用PHP,他们会将样式表(CSS)添加到主题的前端和管理端。

WordPress全局样式:用户可以更好地控制网站的布局和设计

WordPress全局样式的主要内容

全局样式避免了额外的麻烦。使用全局样式,WordPress会自动添加样式。用户不需要额外编写CSS。

用户可以使用全局样式修改主题的样式,或者启用或禁用设置和功能(例如,下拉图标)。

例如,使用“全局样式”,用户可以在一个地方为整个主题选择背景颜色或更改文本大小。

但这并不限制个人定制。用户仍然可以编辑单个块样式并覆盖全局样式。

全局样式如何工作

全局样式允许开发人员使用称为theme.json的新主题设置文件来定义网站和块默认值。JSON对象中的数据被重新格式化为CSS和CSS自定义属性以定义样式。

theme.json文件有两个重要部分:设置和样式。

设置

设置列出了描述编辑器和块行为的全局值或上下文值。具体而言,它定义了:

  • 哪些控件被禁用或隐藏
  • 预设值,如调色板
  • 默认的版式设置

样式

样式定义了主题的设计语言。它使主题编辑器或作者能够设置如下内容:

  • 字号字体大小
  • 线高
  • 链接颜色
  • 标题大小
  • 默认颜色

渲染时,样式将转换为样式表(CSS),并注入到主题的前端和管理端。

如何测试全局样式?

在开始使用全局样式之前,需要一个全站编辑主题(如Twenty Twenty-Two),以及立即激活Gutenberg插件。到了2022年1月WordPress发布5.9版本的时候,这种情况可能会有所改变。推荐阅读:《如何选择好用的WordPress主机》

  • 进入WordPress管理菜单中的站点编辑器。
  • 单击Aa图标打开“全局样式”侧栏。

在“全局样式”下,您将看到两个选项卡:

  • 全局——这些设置会影响网站。例如,您在此处选择的背景色将是网站正文的背景色。
  • 按块类型——这些设置会影响块类型的所有副本。例如,更改组块上的颜色将更改所有分组块的颜色。

全局样式的新改进

全局样式是不断发展的。

在Gutenberg 12.1版本中,WordPress团队向全局样式添加了以下功能:

  • 通过调色板部分设置自定义渐变
  • 在同一渐变段下显示双色调
  • 在文本和链接元素之间拆分排版选项

总结:什么是WordPress全局样式?

WordPress全局样式使用户能够修改他们的网站的外观,而无需编辑单个块或页面。

借助全局样式,WordPress自动通过theme.json文件向主题或块添加样式。这些文件绕过了经典编辑器所需的PHP和CSS。推荐相关阅读:《WordPress可以搭建哪些类型的网站?》

Add a Comment

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