Цель этого нового редактора — сделать добавление мультимедийного контента в WordPress простым и увлекательным. Весь этот пост состоит из фрагментов контента— чем-то напоминающих кубики LEGO, — которые можно перемещать и с которыми можно взаимодействовать. Наведите курсор на блоки, и вы заметите, что они подсвечиваются контурами и стрелками. Нажмите на стрелки, чтобы быстро изменить расположение блоков, не опасаясь потери данных при копировании и вставке.

То, что вы сейчас читаете, — это текстовый блок, самый простой из всех. У текстового блока есть собственные элементы управления, с помощью которых его можно свободно перемещать по всему посту…

… например, этот, который выровнен по правому краю.

Заголовки также представляют собой отдельные блоки, что помогает структурировать и упорядочить ваш контент.

Картинка стоит тысячи слов

Особое внимание в новом редакторе уделяется максимально бережному обращению с изображениями и мультимедиа. Надеемся, что вы заметите, что добавление подписей к изображениям или их размещение на всю ширину страницы стало гораздо проще и надежнее, чем раньше.

Попробуйте выделить и удалить или отредактировать подпись — теперь вам не нужно бояться, что вы случайно выделите изображение или другой текст и испортите презентацию.

Инструмент «Вставка »

Представьте, что все возможности WordPress доступны вам быстро и в одном месте интерфейса. Не нужно разбираться в HTML-тегах и классах или запоминать сложный синтаксис шорткодов. Именно в этом и заключается суть инструмента «Inserter» — (+) кнопка, которую вы увидите вокруг редактора, — она позволяет просматривать все доступные блоки контента и добавлять их в свой пост. Плагины и темы могут регистрировать свои собственные блоки, что открывает самые разнообразные возможности для расширенного редактирования и публикации.

Попробуйте — возможно, вы обнаружите, что WordPress уже может добавлять в ваши записи элементы, о которых вы раньше не знали. Вот краткий список того, что там можно найти на данный момент:

• Текст и заголовки
• Изображения и видео
• Галереи
• Встроенные элементы, такие как видео с YouTube, твиты или другие записи WordPress.
• Элементы макета, такие как кнопки, главные изображения, разделители и т. д.
• И, конечно же, такие списки, как этот 🙂

---

Визуальное редактирование

Огромным преимуществом блоков является то, что их можно редактировать прямо на месте и напрямую изменять содержимое. Вместо того чтобы использовать поля для редактирования таких элементов, как источник цитаты или текст кнопки, вы можете напрямую изменять само содержимое. Попробуйте отредактировать следующую цитату:

Редактор стремится создать новый интерфейс для создания страниц и публикаций, который упростит написание насыщенных контентом постов и будет использовать «блоки», облегчающие то, что сегодня может требовать использования шорткодов, пользовательского HTML или «загадочного» встраивания контента.

Мэтт Малленвег, 2017 год

Информация, относящаяся к источнику цитаты, представляет собой отдельное текстовое поле, аналогичное подписям под изображениями, поэтому структура цитаты сохраняется даже в том случае, если вы выделите, измените или удалите источник. Его всегда легко добавить обратно.

Блоки могут представлять собой всё, что вам нужно. Например, вы можете добавить ненавязчивую цитату в качестве элемента композиции вашего текста или же предпочесть разместить огромную стилизованную цитату. Все эти варианты доступны в инструменте вставки.

Вы можете изменить количество столбцов в галереях, перетащив ползунок в инспекторе блоков на боковой панели.

Многоформатный контент

Если совместить новые варианты выравнивания — «широкий» и «полноширинный» — с галереями, можно очень быстро создать макет с большим количеством мультимедийных элементов:

Конечно, изображение во всю ширину экрана может занимать довольно много места. Но иногда оно того стоит.

Выше представлена галерея, состоящая всего из двух изображений. Это более простой способ создавать визуально привлекательные макеты, не прибегая к использованию флоатов. Кроме того, с помощью переключателя блоков вы можете легко преобразовать галерею обратно в отдельные изображения.

Любой блок может использовать эти выравнивания. Блок «embed» также поддерживает их и изначально адаптируется к размеру экрана:

Вы можете создать любой блок, какой захотите: статический или динамический, декоративный или простой. Вот пример блока с цитатой:

Код — это поэзия

Сообщество WordPress

Если вы хотите узнать больше о том, как создавать дополнительные блоки, или если вы заинтересованы в том, чтобы помочь в реализации проекта, перейдите в репозиторий на GitHub.

---

Спасибо, что тестируете Gutenberg!

👋