Редактор Gutenberg WordPress

Разберём подробнее текстовый редактор Gutenberg WordPress. Заходим в левое Меню админ панели и создаём заголовок Тестовая запись, к примеру.

редактор Gutenberg WordPress Тестовая запись

Однако обратите внимание, что работа идёт у нас во вкладке Документы

Редактор Gutenberg WordPress

Все настройки такие, как в классическом редакторе WordPress прошлых версий, но изменён внешний вид. Если нажать на шестерёнку – блок будет скрыт.

редактор Gutenberg WordPress Настройки редактора

Более того, три точки с правой стороны дают нам дополнительные возможности. Они отсутствовали в прошлом редакторе WordPress.

редактор Gutenberg WordPress дополнительные возможности

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

Редактор Gutenberg WordPress

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

редактор Gutenberg WordPress функция классического редактора

Это, несомненно, обычная функция классического редактора. Если кликнуть, появится рекомендация: “Начните писать или напечатайте текст”, вкладка автоматически поменяется на Блок.

Редактор Gutenberg WordPress

Блок “Параграф”

Называется Параграф. Напишем, к примеру, любое предложение.

редактор Gutenberg WordPress блок параграф

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

редактор Gutenberg WordPress настройка редактора

Работу в текстовом редакторе разбирать не будем. Единственное, что хотелось отметить, кнопку слева в редакторе.

Редактор Gutenberg WordPress

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

редактор Gutenberg WordPress кнопка изменить блок

Здесь можно изменить размер шрифта, буквицу, цвет. Разберём подробнее. Если кликнуть левой кнопкой мыши по треугольнику, можно выставить размер шрифта.

редактор Gutenberg WordPress размер шрифта

Ну а если включить “Буквицу” ползунком, то получится следующее выделение начальной буквы текста

Редактор Gutenberg WordPress

Более того, ещё один момент: запись подсветить, используя “Настройки цвета”. Нажимаем на желтый, например, кружок.

Редактор Gutenberg WordPress

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

Редактор Gutenberg WordPress

Внизу подсказка о качестве сочетания цветов.

Редактор Gutenberg WordPress

Обратите внимание: подсвеченный текст можно к тому же сделать ссылкой.

Редактор Gutenberg WordPress

Блок можно добавлять двумя кнопками

Редактор Gutenberg WordPress

Удалить блок, а также произвести дополнительные действия можно нажав на значок

Редактор Gutenberg WordPress

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

Редактор Gutenberg WordPress

Рассмотрим, к примеру, работу с самыми интересными блоками.

Блок “Цитата”

Открываем часто используемые. Рассмотрим, например, цитаты.

Редактор Gutenberg WordPress

Пишем Тестовая запись. Отображение курсивом. Если попробовать изменить, то отобразится меню.

Редактор Gutenberg WordPress

Предлагают два стиля отображения записи и преобразование в блоки. Посмотрим на сайте.

Редактор Gutenberg WordPress

Блок ”Выдержка”

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

Редактор Gutenberg WordPress

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

Редактор Gutenberg WordPress

Выбираем бирюзовую подсветку и синий цвет текста.

Редактор Gutenberg WordPress

Но этот блок можно конфигурировать: сделать запись на фоне.

Редактор Gutenberg WordPress

Выбираем белый цвет текста. Посмотрим результат на сайте.

Редактор Gutenberg WordPress

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

Блок “Видео”

Попробуем вставить блок Видео.

Редактор Gutenberg WordPress

Берём ссылку из адресной строки и вставляем в блок редактора.

Редактор Gutenberg WordPress

Смотрим результат

Редактор Gutenberg WordPress

Видите всё легко, просто и быстро.

Блок “Обложка”

Попробуем в основных блоках: Обложка.

Редактор Gutenberg WordPress

Мне нравится.

Редактор Gutenberg WordPress

В этот блок вы вставляем изображение с компьютера или библиотеки сайта.

Редактор Gutenberg WordPress

Вводим текст, выделяем жирным, делаем ссылкой

Редактор Gutenberg WordPress

Мы можем фиксировать фон. Он станет большим на весь экран

Редактор Gutenberg WordPress

Изменяем фон

Редактор Gutenberg WordPress

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

Редактор Gutenberg WordPress

Меняется также прозрачность фона. Таким образом, можно создавать дополнительные обложки для подписных страниц. Работа с блоками в редакторе я думаю принципиально понятна. Экспериментируйте, выбирайте нужные вам функции. На этом рассмотрение темы “Редактор Gutenberg WordPress” окончено.

Переходим на следующий этап обучения: Раздел wordpress рубрика записи……