Учебное пособие по Гутенбергу: как использовать новый редактор блоков WordPress

Названный в честь изобретателя печатного станка Иоганна Гутенберга, новый редактор блоков WordPress Gutenberg дебютировал в выпуске WordPress 5.0 в качестве редактора по умолчанию для WordPress.

Миссия проста — создать новый опыт написания и редактирования с помощью WordPress.

Редактор Gutenberg с блоками предоставляет уникальный опыт создания мультимедийного контента с помощью WordPress.

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

Через мгновение я расскажу вам, как использовать редактор блоков Gutenberg.

Работая со многими клиентами, использующими WordPress, немногие были в восторге от сложного перехода к редактированию.

Это, вероятно, объясняет, почему миллионы пользователей WordPress установили классический редактор после того, как у них отняли выбор с выпуском Гутенберга.

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

Я надеюсь, что после прочтения этой статьи вам будет удобно работать с редактором блоков.

Шаг за шагом: как использовать редактор блоков Gutenberg?

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

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

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

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

Либо наведите указатель мыши между блоками, появится значок «Добавить блоки», щелкните его, чтобы добавить блок.

Далее идут кнопки «Отменить» и «Повторить».

Следующий значок на верхней панели инструментов показывает структуру вашего контента.

Далее идет навигация по блокам.

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

Справа,

Это довольно просто: «Сохранить черновик», «Предварительный просмотр сообщения» (открывается в новой вкладке) и «Опубликовать».

Следующий значок переключает отображение настроек. Он отображает или скрывает правые панели.

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

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

Итак, что вы можете сделать с большим количеством инструментов и опций?

• У вас есть панель инструментов — доступ ко всем инструментам блоков и документов в одном месте.
• Режим прожектора. Позволяет сосредоточиться на блоке за раз
• Полноэкранный режим. Взорвите свой редактор, чтобы полностью не отвлекаться на редактирование.
• Переключайтесь между визуальным редактором — тем, что вы видите сейчас, и редактором кода — если вам нужно написать код, который не могут обработать блоки кода и HTML.
• Управление многоразовыми блоками
• Сочетания клавиш и
• Скопируйте все содержимое в редактор.

Блоки Гутенберга

До сих пор вы продолжали видеть блоки, но что это такое?

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

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

При создании контента в классическом редакторе все, что вам нужно было сделать, это ввести контент в текстовые области.

С новым редактором вы будете использовать блоки, организованные по типу контента. Чтобы добавить текстовое содержимое, нужен блок текста/абзаца, блок «Изображения — изображения», Html, блок HTML.

Это нечто отличное от классического редактора, где вы вставляете весь свой контент в одном месте.

Использование инструментов блока

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

В отличие от классического редактора, в котором все инструменты были видны.

Чтобы получить доступ к этим инструментам, щелкните содержимое в блоке. Мы будем использовать абзац/контент, так как вы часто будете его использовать.

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

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

Блок абзаца, например, имеет инструменты форматирования текста: выравнивание по левому краю, выравнивание по центру, выравнивание по правому краю, жирный шрифт, курсив, вставка гиперссылки и зачеркивание текста.

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

Две функции в наборе инструментов блока, которые пересекают блоки, — это « Блок преобразования » в начале, а затем в конце вы должны увидеть значок « Дополнительные параметры» — три вертикальные точки — который содержит дополнительные настройки для блока. вы работаете с.

Преобразование блока Гутенберга

Чтобы преобразовать блок, щелкните блок, как вы видели в блоке абзаца выше.

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

Преобразование блока абзаца в цитату теперь выглядит так.

Кнопка дополнительных параметров

Другая кнопка, которую имеет набор инструментов для блоков, — это значок « Дополнительные параметры » — три вертикальные точки. Щелкните любой блок, чтобы увидеть его.

С дополнительными параметрами вы можете делать больше со своим блоком, например; Скрыть настройки блока, Дублировать блок, Вставить блок до или после предыдущего и последующего блоков, отредактировать блок как HTML, добавить блок в повторно используемые блоки и, наконец, Удалить или удалить блок.

Изменение постоянной ссылки на запись или страницу с помощью редактора блоков Gutenberg

Щелкните заголовок сообщения или страницы. Над ним будет отображаться ссылка.

Нажмите кнопку «Изменить», затем измените ссылку и нажмите «Сохранить».

Настройки документа и блока в редакторе блоков Gutenberg

Справа от каждого поста или страницы Gutenberg есть панель с двумя вкладками.

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

Панель блока содержит настройку блока.

Щелкните блок в области содержимого, затем на правой панели щелкните панель Блок.

Вывод

Мы рассмотрели немного информации о редакторе Gutenberg Blocks.

Я надеюсь, что с этими знаниями будет менее пугающе использовать их для создания и публикации контента.

Вы используете новый редактор блоков? Каков ваш опыт работы с ним?

Вы также можете преобразовать существующие сообщения WordPress в блоки Gutenberg?