Транскрипция
Введение
Создание записей и страниц с помощью блочного редактора WordPress. Сегодня мы погрузимся в самую суть создания контента, используя мощный блочный редактор WordPress.
Результаты обучения
Результаты обучения этого урока: определение блочного редактора, навигация по интерфейсу блочного редактора, различение области редактирования контента и боковой панели настроек, создание страницы и записи, а также использование блоков, паттернов и режима списка.
Введение в блочный редактор
Блочный редактор WordPress позволяет создавать сайт с помощью блоков без необходимости писать код. Как мы уже видели, войдите в панель управления WordPress, чтобы создать запись или страницу. В панели управления перейдите к записям или страницам в левом меню. Давайте создадим новую страницу, чтобы подробно изучить интерфейс блочного редактора. После добавления новой страницы мы также можем указать подходящее название страницы. Нажав на кнопку вставки, вы можете добавить различные блоки для создания страницы.
Блоками могут быть абзацы, изображения, колонки, галереи, таблицы с ценами и многое другое. Паттерны блоков — ещё одна замечательная функция. Это заранее сгруппированные или предварительно разработанные блоки, которые можно быстро добавить для создания целых разделов, а затем изменить в соответствии со своими потребностями.
Справа, рядом с паттернами, мы можем добавлять медиафайлы. Во-первых, из нашей библиотеки медиафайлов или из Openverse. Openverse предоставляет медиафайлы с открытой лицензией, доступные для бесплатного использования.
Добавление блоков
Добавить блок можно несколькими способами. Во-первых, можно нажать кнопку вставки в левом верхнем углу или кнопку вставки внутри страницы. Шесть блоков, отображаемых под строкой поиска, будут недавно использованными блоками. Также можно использовать команду с косой чертой. Например, введём косую черту и слово «image», а затем добавим изображение из нашей библиотеки медиафайлов, куда я уже его загрузил. Затем я нажму Enter и добавлю текст в блок абзаца. После этого добавлю ещё один абзац.
Интерфейс блочного редактора: область создания контента, боковая панель настроек и режим списка
Интерфейс разделён на три основные области. Область редактирования контента, левая боковая панель для выбора блоков или режима списка, о котором мы поговорим через мгновение, и расположенная справа боковая панель настроек. Боковая панель настроек справа предоставляет дополнительные настройки и параметры для выбранного блока, позволяя дополнительно стилизовать его. Разумеется, для каждого блока доступны разные настройки.
При выборе блока вы также увидите панель инструментов, связанную с конкретным блоком. В данном случае это панель инструментов блока абзаца. Слева направо панель инструментов блока позволяет преобразовать этот блок в блок другого типа, перетащить блок в новое место или использовать стрелки для его перемещения, изменить выравнивание текста, выбрать полужирное или курсивное начертание, а также добавить ссылку. Стрелка раскрывающегося списка позволяет выделять текст, добавлять сноски и применять другие параметры оформления. Нажав на три вертикальные точки, вы увидите дополнительные параметры.
Далее важно обратить внимание на режим списка. В этом примере вы заметите, что я создал целую страницу, используя различные блоки. Прокрутив страницу вверх, мы можем открыть режим списка в левом верхнем углу. Режим списка помогает перемещаться между уровнями контента и вложенными блоками. Это незаменимая функция редактора WordPress, которая упрощает работу с блоками на сайте. Вы можете просмотреть точный порядок и структуру каждого блока на странице, что особенно полезно, если на странице много контента. Можно выбирать блоки, внутри которых находятся другие вложенные блоки. Можно нажимать на блоки и перетаскивать их в другую часть страницы. При нажатии на многоточие — три точки рядом с любым блоком в режиме списка — становятся доступны различные полезные параметры.
Создание страницы
Давайте вернёмся к исходной странице и продолжим создавать её с помощью блоков, чтобы увидеть блочный редактор в действии. Сначала добавим блок галереи и выберем три изображения из нашей библиотеки медиафайлов. После вставки я выберу блок галереи, нажму на три вертикальные точки и выберу пункт «Добавить после». Затем нажму кнопку вставки в левом верхнем углу и добавлю паттерн — предварительно разработанную группу блоков. Я выберу один из рекомендуемых паттернов для планирования визита. Затем открою режим списка, выберу блок группы и изменю выравнивание текста. Далее рассмотрим настройки боковой панели. Выбрав блок, мы можем использовать настройки боковой панели для его дополнительного оформления. В данном случае мы можем добавить закруглённый эффект к изображению. Я выберу второй абзац и с помощью панели инструментов блока изменю текст на полужирный. Затем выберу режим списка, чтобы убедиться, что выбран родительский блок галереи. В настройках боковой панели я изменю количество колонок с трёх на две. Наконец, я выберу блок кнопок и изменю цвет фона на зелёный.
Теперь, я надеюсь, вы видите, как элементы блочного редактора складываются в единую картину: блоки используются для добавления контента, боковая панель настроек — для оформления и редактирования контента, а режим списка — для навигации по нему.
Создание и редактирование страниц в редакторе сайта
Обратите внимание, что создавать и редактировать страницы можно также в редакторе сайта. Давайте перейдём в раздел «Внешний вид» и нажмём «Редактор». Это, конечно же, приведёт нас в редактор сайта. Затем мы можем выбрать страницы. Я открою страницу «Использование блочного редактора», а затем выберу «Редактировать». В редакторе сайта мы добавляем контент в блок контента. Далее всё работает точно так же, и мы можем продолжать создавать страницу с помощью блоков. В данном случае я добавлю блок встраивания YouTube, укажу свой URL, а затем встрою видео на страницу.
Создание и редактирование записей
В заключение отметим, что создание записи происходит так же, как создание страницы. Мы используем блоки для формирования структуры контента. Обратите внимание: добавление рубрик, меток и изображения записи рассматривается в другом уроке.
Заключение
Надеюсь, теперь вы лучше понимаете, как перемещаться по блочному редактору, а также как использовать блоки, боковую панель настроек и режим списка.