Блоки (Gutenberg FSE)

Блочный редактор Gutenberg — это современный редактор контента в WordPress, основанный на модульной системе блоков. Он заменяет классический редактор и позволяет легко создавать сложные макеты страниц с помощью визуального интерфейса.

Блоки — это отдельные элементы (текст, заголовки, изображения и др.), каждый с собственными настройками. Контент собирается из этих блоков и сохраняется в базу данных.

Редактор напоминает page builder (Elementor, WPBakery). При правильных стилях темы можно добиться идентичности контента в админке и на сайте.

Навигация

• Sourse Code: https://github.com/WordPress/gutenberg

  Внутри репозитория есть папка docs/ — это дока для разработчиков. Это источник для https://developer.wordpress.org/block-editor (официальный сайт документации). docs/ содержит более свежую информацию, потому что правки сначала попадают в GitHub, а потом синхронизируются.

  • Native Blocks

  • Compotents
    • InnerBlocks

• Документация: https://developer.wordpress.org/block-editor/

  • Getting Started
  • How-to Guides
    • Blocks
  • Reference Guides
  • Explanations

• Storybook: https://wordpress.github.io/gutenberg/

• Примеры блоков: https://github.com/WordPress/block-development-examples/tree/trunk/plugins

• Тестовый сайт с блоками: https://wordpress.org/gutenberg/

• Сomponents guide: https://awhitepixel.com/wp-content/uploads/2020/07/awhitepixel-gutenberg-components-guide.pdf

Еще полезные ссылки:

• https://wp-gb.com/ - для разработчиков - предоставляет визуальную документацию React компонентов.

Основные элементы редактора:

1. Inserter — панель вставки блоков;
2. Контент — редактируемая зона блоков;
3. Настройки — панель параметров блока или записи.