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


Если вы используете WordPress уже несколько лет, то вы помните, как ребята из WordPress выпустили редактор Gutenberg в WordPress 5.0 еще в 2018 году.

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

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

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

Чего ожидать от WordPress Gutenberg

Главное, что нужно знать о редакторе Гутенберга, это то, что он блочный. Это означает, что все, что вам нужно добавить, управляется через блоки. Блоки в Гутенберге включают (но не ограничиваются):

  • Абзац
  • Заголовок
  • Изображение
  • Список
  • Цитата
  • Код
  • Предварительно отформатированный
  • Цитата
  • Таблица
  • Есть также несколько других дополнительных блоков, которые используются редко. Вы можете увидеть дополнительные блоки, если установите новые плагины WordPress в редактор.

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

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

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

    Создание публикаций и добавление блоков

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

    Откроется окно редактора сообщений. Здесь тоже все по-другому. Вы увидите редактор Gutenberg WordPress по умолчанию.

    Добавление элементов блока в редакторе Gutenberg

    .

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

    /дел>

    Блоки абзацев

    Самый распространенный первый блок, который люди добавляют после заголовка, — это блок абзаца. Для этого выберите Абзац во всплывающем окне.

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

    Вот несколько советов по добавлению блоков абзацев в редакторе Гутенберга.

    • Ваш абзац может быть сколь угодно длинным. Текст автоматически перенесется на следующую строку, как в классическом редакторе.
    • Если вы нажмете Ввод , редактор Гутенберга автоматически создаст новый блок абзаца, однако он будет выглядеть как второй абзац с разрывом абзаца.
    • При выделении любого текста в абзаце откроется окно форматирования, в котором вы можете изменить форматирование этого текста или преобразовать блок в список или блок другого типа.
    • Выберите три точки и выберите Удалить блок , чтобы удалить блок абзаца и заменить его чем-то другим.
    • Блоки изображений

      Если вы выберете блок «Изображение», вы увидите поле «Изображение», в котором можно нажать кнопку «Загрузить», чтобы загрузить изображение в публикацию со своего компьютера. Выберите ссылку Медиатека , чтобы использовать изображение из существующей медиатеки, или ссылку Вставить из URL , чтобы создать ссылку на изображение с другого сайта.

      <рисунок class="aligncenter size-large">

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

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

      Список блоков

      Когда вы добавляете новый блок и выбираете Список , блок списка вставляется в этот момент статьи..

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

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

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

      Другие блоки

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

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

      • Таблицы
      • Файлы и медиа
      • Видео
      • Тег «Еще»
      • Разрывы страниц и разделители.
      • Виджеты, такие как значки социальных сетей, облака тегов, календарь и виджеты плагинов WordPress.
      • Встраивайте код для социальных сайтов, медиа-сайтов, таких как YouTube и Spotify, и т. д.
      • Другие функции Гутенберга

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

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

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

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

        Использование редактора Glutenberg в WordPress

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

        Другие значки в этом меню обеспечивают быстрый доступ к другим функциям Гутенберга.

        • Значок пера Редактировать позволяет переключиться в режим выбора, чтобы упростить выбор блоков. Дважды щелкните блок, чтобы вернуться в режим редактирования.
        • Значки
        • Отменить или Повторить (изогнутые стрелки влево и вправо) отменяют или повторяют последнее изменение.
        • Значок i (Подробности) показывает количество символов, слов, заголовков, абзацев и блоков в вашем сообщении.
        • Значок Структура позволяет быстро переходить к блокам в сообщении в зависимости от их порядка в структуре сообщения.
        • Многим людям приходится привыкать к редактору Гутенберга в WordPress. Но, почувствовав, насколько легко создавать, редактировать и манипулировать блоками элементов в ваших сообщениях, вы обнаружите, что процесс создания сообщений и страниц стал быстрее и продуктивнее.

          .

          Похожие сообщения:


          2.01.2021