Какие новые возможности он приносит в WordPress?

WordPress 5.0 представил совершенно новый блочный редактор под названием Gutenberg. Это более простой и новый способ создания контента. Вместо простого редактора и редактора внутреннего кода новый интерфейс упрощает перетаскивание элементов на ваш сайт WordPress.

Гутенберг в основном извлек элементы из некоторых самых популярных плагинов WordPress, таких как Elementor и Divi, которые считаются «визуальными композиторами». Гутенберг далеко не так совершенен, как эти решения, но это шаг в правильном направлении.

Ниже приведен скриншот классического редактора WordPress. Кнопки форматирования похожи на текстовый редактор для Microsoft Word.

Начиная с WordPress 5.0 и выше, появился новый редактор блоков от Гутенберга, показанный ниже.

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

Преимущества редактора WordPress Gutenberg

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

Чтобы добавить таблицу с помощью редактора WordPress Gutenberg, все, что вам нужно сделать, это добавить блок таблицы, выбрать строки и столбцы и добавить свой контент.

При использовании редактора WordPress Gutenberg очень просто перемещать области содержимого вверх и вниз, перетаскивая блоки.

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

Создание нового блога или страницы с помощью редактора блоков WordPress Gutenberg

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

В админке WordPress нажмите на

• Сообщения> Добавить новый
• Страницы> Добавить новый

Первым блоком всех страниц и постов является заголовок.

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

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

Когда вы нажимаете на один из знаков «+», появляется меню «Блок», в верхней части которого находится панель поиска, а внизу — наиболее часто используемые блоки.

Как работать с блоками WordPress Gutenberg

Все блоки имеют свою собственную панель инструментов вверху. Кнопки панели инструментов меняются в зависимости от типа редактируемого вами блока.

На приведенном ниже снимке экрана показан блок абзаца с базовым форматированием, таким как полужирный шрифт, выравнивание текста, вставка ссылки и курсив.

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

Как сохранить и повторно использовать блоки в редакторе WordPress Gutenberg

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

От кнопки меню в верхнем правом углу панели инструментов блока, нажмите на три вертикальные точки. Затем выберите Добавить в повторно используемые блоки.

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

Добавить повторно используемый блок на пост или страницу

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

Найдите сохраненный блок на вкладке «Многоразовые», или вы можете найти его там же.

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

Многоразовые блоки находятся в наборе данных WordPress. Нажмите на ссылку «Управление всеми используемыми блоками», чтобы управлять ими.

Управление многоразовыми блоками WordPress Gutenberg

Со страницы менеджера блоков вы можете редактировать, удалять или экспортировать повторно используемые блоки для использования на другом веб-сайте WordPress.

Управление и публикация параметров редактора WordPress Gutenberg

Каждая страница и пост WordPress содержит много метаданных, таких как избранные изображения, дата публикации, теги и категории.

Все эти параметры расположены в правой колонке экрана редактора.

Плагины для WordPress Gutenberg

Многие плагины WordPress предопределены как блоки, что делает их простыми и готовыми к использованию с Gutenberg.

WP Forms позволяет пользователям добавлять формы на страницы и сообщения, используя блок виджетов.

WP Forms — это простой в использовании инструмент для перетаскивания форм. Создать контакт, подписку, обратную связь, оплату и другие виды форм.

Используйте готовые шаблоны форм и рабочие процессы для создания привлекательных мобильных адаптивных форм. WP Forms также предлагает Pro версию, если вы хотите более продвинутые функциональные возможности и функции.

Блоки WooCommerce это один из самых известных и популярных плагинов для интеграции функций электронной коммерции на ваш сайт.

Создавайте привлекательный контент, используя текст и мультимедиа в блоке с редактором Гутенберга. Добавьте отдельные продукты или группу связанных продуктов, применив фильтр на основе таких критериев, как статистика продаж и категории.

Yoast SEO проверяет ваш контент с помощью обычных мер SEO, чтобы помочь оптимизировать и редактировать ваши посты или страницы.

WordPress Gutenberg Editor Удобство использования

Редактор Гутенберга делает все то же самое, что и классический редактор. Ниже приведены некоторые распространенные и популярные блоки.

Блок абзаца

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

Другой способ использовать блок абзаца — щелкнуть блок вставки во всплывающем окне после нажатия знака (+).

Текстовые столбцы

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

Добавление ссылки

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

Добавить блок изображения

Редактор WordPress Gutenberg имеет готовый блок изображений. Нажмите на него, чтобы добавить изображение.

Есть три способа добавить изображение. Загрузите его, добавьте в свою медиатеку или перетащите с компьютера.

Другой способ добавить изображение — перетащить его с компьютера. Редактор Гутенберга автоматически создаст для него блок изображения.

Добавьте метаданные, такие как размер, альтернативный текст и ссылку на изображение, в настройках блока изображения справа.

Блок галереи изображений

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

Редактор WordPress Gutenberg включает в себя множество дополнительных типов блоков для использования. Для полного списка, прочитайте WordPress.org статья поддержки на блоках,

WordPress Gutenberg появился как решение проблем, которые некоторые пользователи изучали в классическом редакторе. Его интерфейс перетаскивания позволяет не-специалистам разрабатывать и управлять профессионально выглядящим веб-сайтом.