Layout Grid 区块

描述

想要创建一个基于列的版面并且带有简单的自定义列宽度以及位置?或者也许你想要对齐你的内容到一个全局的网格,通过你的文章。通过Layout Grid 区块你可以将这些纳入囊中。这里同样有选项可以提供一些指定的Layout来支持手机或者平板的断点。选择一系列的columns(1-4),然后继续并且重新调整位置,每一列你想要看到的,用于任意屏幕。(可选的) 应用背景颜色以及内边距来添加重点。

源和支持

你可以跟随开发,抛出一个问题,建议一些功能,并且可以在Github上面查看仓库:https://github.com/automattic/block-experiments

屏幕截图

  • Grid Layout 选择器
  • 3列网格带有重新调整的手柄。

区块

该插件提供了1个区块.

  • Layout Grid A Gutenberg container block to let you align items consistently across a global grid.

评价

2021年5月23日
Thank you, nice and helpful! little advice: Add to tags "Gutenberg" in description. I didn't find you quickly. In the beginning i was looking for something like this by tag #Gutenberg
2021年4月4日
One of my (very, very few) essential plugins for WP. It makes building layout a breeze. I made my own fork and build though, to make some changes: -I changed the basic gutter values to CSS variables, so now I can use my own values. -I changed to media queries as well, for my setup. -I changed the editor visually a bit, to make it look like an editor, see columns etc, but that's just a personal preference. And what I couldn't do, but would be nice to have, to change the order of columns, and the number of rows on mobile/tablet, when it starts collapsing. But again, it's essential, and should be part of core WP. Thanks guys!
2020年11月22日
Very nice approach. Keep it up.
2020年10月6日
Started using this block layout on a WordPress.com site as it was just there by default, then when I realised it wasn't available on my WordPress sites, I had to go get it. Very handy layout...
阅读所有4条评价

贡献者及开发者

“Layout Grid 区块” 是开源软件。 以下人员对此插件做出了贡献。

贡献者

“Layout Grid 区块”插件已被翻译至19种本地话语言。 感谢所有译者为本插件所做的贡献。

将“Layout Grid 区块”翻译成您的语言。

对开发感兴趣吗?

您可以浏览代码,查看SVN仓库,或通过RSS订阅开发日志

更新日志

1.7 – 13th July 2021

  • Add initial support for WordPress mobile app
  • Fix incorrect behaviour of drag handles in Safari
  • Fix sticky block styles
  • Fix image right alignment

1.6 – 26th March 2021

  • 删除不推荐使用的古腾堡函数
  • 将断字行为恢复到 1.3 – 它导致了太多问题
  • 删除 1.2.4 中似乎不再需要的 Firefox 修复程序并导致其他问题
  • 将 front.css 合并到 style.css 中
  • 强制网格预览为桌面模式,用来优化inserter的外观.

1.5 – 8th February 2021

  • 改进较小设备上的编辑器响应行为
  • 将最低 WordPress 版本提高到 5.6

1.4 – 15th January 2021

  • 对网格列内的文本使用连字符
  • 为具有自定义背景颜色的列添加缺少的 has-background
  • 修复 CSS 以在完整站点编辑器中使用

1.3 – 21st July 2020

  • 添加垂直对齐到网格以及网格列
  • 带编辑器预览断点的镜像网格设备断点(需要 WP 5.5 或 Gutenberg 插件)
  • 最低限度的WordPress版本提高到5.5

1.2.4 – 14th July 2020

  • 修复 Firefox 中的一些块在网格之外断裂
  • 修复编辑器边距用于一些主题

1.2.3 – 29th June 2020

  • 修复一些没有能在编辑器中加载的style

1.2.2 – 23rd June 2020

  • 修复 1.2.1 中的 CSS 加载修复,使其使用 wp_register_style

1.2.1 – 10th June 2020

  • 修复块插入器以显示在网格列内
  • 修复编辑器中的垂直边距,使其更好地匹配显示
  • 修复 CSS 加载,以便仅在使用块时添加
  • 修复选择内部块时出现的网格线

1.2 – 29th April 2020

  • 将选定的断点移动到工具栏并允许它被切换
  • 将最低 WordPress 版本提高到 5.4
  • 改进拖动手柄行为
  • 修复网格块内的多选
  • 修复网格前端 CSS 的输出
  • 修复全宽时尺寸关闭的问题
  • 修复列布局更改时添加的旧类

1.1 – 10th March 2020

  • 添加选项来禁用开始和结束 gutters 用于全出血版面
  • 添加选项以控制 gutter 大小
  • 修复 Firefox 100% 高度错误,当多个块位于一列内时
  • 提升IE 11 支持

1.0.5 – 28th January 2020

  • 修复了那些不支持Gutenberg的主题的编辑器布局

1.0.4 – 21st January 2020

  • 修复古腾堡 7.3 的布局问题

1.0.3 – 12th December 2019

  • 修复在 7.1.0 编辑器中被忽略的网格值
  • 修复在组块内时网格的裁剪

1.0.2 – 28th November 2019

  • 修复重复列跨度的错误

1.0.1 – 26th November 2019

  • 修复编辑历史将块置于中间状态的问题
  • 修复编辑器中网格的裁剪

1.0 – 7th November 2019

  • 初始化版本