明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

布莱恩·加德纳,StudioPress 的创始人和创世纪框架的共同创建者,在目录中有一个新的块主题,称为 明亮模式. 该主题具有充满活力的调色板和雅致的渐变、14 种设计精美的块图案,以及隐藏在自定义块样式中的许多有趣的变化。

很难为许多块主题确定一个利基,因为模式和模板使它们足够灵活,几乎可以服务于任何用例。 明亮模式属于这一类。 它可以很容易地用作企业或个人网站、博客或投资组合。

如果你仔细观察,你会发现加德纳标志性风格的微妙暗示。 它直截了当,极简主义,对排版和间距一丝不苟。 颜色明亮但和谐平衡,因此不排除在专业环境中使用明亮模式。

Bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

Gardner 作为 OG 主题作者之一,拥有独特的视角,从 WordPress 主题的早期开始,一切才刚刚开始。 他以革命主题帮助启动了商业主题生态系统,并继续将同样的开拓精神带入块主题的新世界。

“去年夏天,我读了 Justin Tadlock 写的一篇关于块模式和模式目录(当时处于测试阶段)的文章,”Gardner 说。 “他链接到它,我花了几分钟点击。 最后,我看到了一个我认为很酷的图案并点击了“复制图案”按钮。 我想看看这一切是如何工作的,所以我在我的博客上打开了一篇文章并粘贴了代码。 瞧,就在那里。 那一刻,我知道——现代 WordPress 的潜力在我面前闪现。”

Gardner 的新主题利用模式来定义您在 演示. 明亮模式提供了一系列丰富多彩的图案,用户可以将它们插入到他们的网站中,包括带有标题、文本和按钮的封面图像、多个推荐、不同的查询布局以及多个页脚和页眉设计。 查看演示 通过示例内容查看它们的全部运行情况。

bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-1 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

Gardner 目前正在构建更多图案以添加到 Bright Mode 的系列中。 他说接下来可能出现的是英雄版块、特色框、号召性用语、链接页面和投资组合模式。

“我花了几个月的时间对明亮模式的设计进行迭代,所以我觉得有必要完成两件事:交付它并为添加更多内容敞开大门,”加德纳说。

当您第一次安装明亮模式并单击自定义时,它看起来不像演示。 用户必须插入图案以使其看起来更接近屏幕截图。 我向 Gardner 询问默认情况下在主页中插入模式以匹配演示,他说这有可能在未来进行更新。

“至于默认插入模式,唯一可能有用的实例是明亮模式主页,它只是一个欢迎模式,然后是下面的网格循环,”他说。 “当然,随着我添加更多模式,这可能是更新的一部分。”

此主题的一个独特功能是标题块具有一组有趣的块样式,可为文本创建各种颜色渐变。

bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-2 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

“可访问性和颜色对比对于这个主题的设计至关重要,以至于我什至创建了 颜色页面,”加德纳说。 鉴于许多新发布的 FSE 主题没有任何有意的颜色处理方法,他的目标是激励更多的主题作者将颜色作为考虑因素。 Gardner 已经确定了一组主要、次要和三次颜色,这些颜色在整个主题中用于不同的块样式。

Bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-3 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

“主要颜色、次要颜色和三次颜色都通过了 WCAG 2.0 AA 级和 WCAG AAA 级对比度测试:普通文本、大文本、图形对象和用户界面组件,”Gardner 说。

查看 时尚指南,您可以看到应用于按钮、引号和社交图标的颜色。

Bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-4 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

明亮模式在报价块中提供多种不同的样式选项。 它们可以是纯色的,也可以是彩色背景或渐变背景。 没有背景的引号也可以应用颜色渐变下划线。 这样做的好处是可以在每个引用的基础上进行更改,并且不必对每个块引用都相同。 用户可以通过不同的设计来定制他们的报价,这会带来很多乐趣。 其中一些如下图所示。 当在整个站点中谨慎使用时,它们非常引人注目。

Bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-5 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题
bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-6 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

Gardner 说他最喜欢这个主题的 Bright Mode 的一个方面是 Cover Block 的使用方式 单页. 它将特色图像拉入 Cover 块,并为阴影和全高选项提供自定义块样式。 (后备只是一个带有标题的黑色标题)。 “我觉得这似乎真的展示了现代 WordPress 的可能性。”加德纳说。

Bright-mode-a-new-block-theme-with-vibrant-colors-patterns-and-custom-block-styles-7 明亮模式:具有鲜艳色彩、图案和自定义块样式的新块主题

在测试了主题之后,我惊讶于在块样式中有多少隐藏的宝石可以发现,以及用户对各个方面有多少创意控制。 我唯一要改变的是确保主页看起来与演示相似,这样用户就可以感觉到他们有一个可靠的起点,而无需寻找模式来重现演示。 Garnder 具有创造美观模式的天赋,在这种情况下,他计划的更多样化的设置(投资组合、号召性用语等)将使明亮模式能够在更多情况下使用。

虽然很多传统题材作者还是有一些 抵制阻止主题获得更多知名度 在主题目录中,Gardner 有幸在 WP Engine 担任开发人员倡导者的日常工作,在那里他与社区互动并帮助用户过渡到块编辑器和全站点编辑。

“基本上,跟上 Gutenberg 的发展步伐以及 WordPress 的新功能是我得到报酬的工作,”Gardner 说。 “所以很自然,这使得尝试主题变得很容易(就像我们用 ) 并回馈资源,例如我们新推出的网站 建筑商. 最重要的是,我在晚上和周末的空闲时间都在深入挖掘,看看我能在多大程度上创造性地做事。”

明亮模式是他个人探索块主题可能的结果。 它是 在 WordPress.org 上免费提供 或通过管理员内的主题安装屏幕。 在主题的未来更新中,将会有更多的模式、模板和变体。 明亮模式是首批 100 块主题 在目录中,WordPress.org 今天通过了一个里程碑。

资源

相关文章