Гутенберг (Gutenberg) WordPress – Как использовать редактор контента для создания статей, продуктов и дизайна страниц?

Редактор контента Гутенберг (Gutenberg) в WordPress позволяет создавать статьи, продукты и пользовательские страницы без использования специальных плагинов. Это не просто текстовый редактор, а расширенный шаблон и способ создания и управления контентом в системе WordPress.

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

Что такое Гутенберг?

WordPress определяет Гутенберга в рамках расширенного шаблона мышления при создании и публикации веб-сайтов на основе WordPress, чтобы произвести революцию в области управления контентом. Это именно то, что сделал Йохан Гутенберг, которого считают отцом революции печати, и этот плагин создан на имя изобретателя.

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

В прошлом WordPress был основан на редакторе контента, который является WYSIWYG, обычным редактором, с которым многие, вероятно, знакомы, и включает в себя строку меню со всеми инструментами, а также текстовую область, в которой вы пишете. Другими словами, старый редактор был похож на программное обеспечение для редактирования документов (Microsoft Word, Google Docs и т.п.). Но он был устаревшим и не соответствовал новому образу мышления, который они хотели реализовать в WordPress.

Что ж, Гутенберг (Gutenberg) совсем не похож на старый редактор контента, а основан на блоках. Блок – это любой компонент для добавления контента через редактор контента Gutenberg. Существует множество компонентов (блоков), которые подробно описаны ниже в статье, поэтому вы можете добавлять текст, изображения, видео, заголовки, вставки из социальных сетей и многие другие блоки.

Установка плагина Gutenberg

Как правило, вам не нужно устанавливать плагин Gutenberg для вашего сайта WordPress, чтобы использовать его, потому что это основной плагин (неотъемлемая часть системы).

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

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

Особенности Гутенберга

Редактор контента Gutenberg предлагает множество функций и инструментов, о которых стоит знать:

  • Большая библиотека блоков – тексты, изображения, вложения, цвета фона и многое другое.
  • Возможность встраивать контент с других сайтов без знания кода или программирования HTML, CSS или JS – например, сообщение Facebook, сообщение Instagram и тому подобное.
  • Использование многоразовых блоков без необходимости их повторного добавления вручную.
  • Автоматически сохранять контент – для сохранения написанного контента.
  • Предварительный просмотр – вы можете предварительно просмотреть перед публикацией как для обычных компьютеров, так и для мобильных телефонов или планшетов.
  • Управление дополнительными инструментами – если вы используете дополнительные плагины, такие как плагины продвижения веб-сайтов и маркетинга, редактирование дополнительного контента и т.д., Система предлагает управлять ими, добавляя и удаляя, так что интерфейс становится удобным и настраиваемым.
  • Различные режимы записи – Есть несколько режимов записи, которые позволяют писать контент так, чтобы другие вещи вас не беспокоили.
  • Полностраничный дизайн – можно создавать полные страницы без знания кода и без плагинов для построения страниц, таких как Elementor.
  • Настройка блоков – вы можете настроить и определить каждый блок, начиная с размера текста, цветов, отступов, интервалов и т.д.
  • Расширения блоков – есть определенные плагины, которые предлагают больше настраиваемых блоков, например WooCommerce отображает блоки для магазинов и продуктов.

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

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

Итак, какие блоки есть в плагине Gutenberg? Вот список:

  • Общие блоки – абзац, изображение, видео, заголовок, список, галерея, изображение темы, файл.
  • Дизайн – код, классический, кастомный HTML, форматированный, таблица, цитата, стихи.
  • Макет – разрыв страницы, пробел, разделитель, кнопка, группа, столбцы.
  • Виджеты – шорткод, архивы, календарь, категории, недавние комментарии, недавние сообщения, RSS, поиск, кнопки социальных сетей, облачные теги.
  • Встраивание – Twitter, YouTube, Facebook, Instagram, Spotify, Vimeo, WordPress, Reddit и другие.

Кроме того, если вы используете дополнительные плагины, блоков может быть больше. Например:

  • WooCommerce – самые продаваемые товары, избранные товары, избранные категории, обзоры товаров, все товары, товары со скидкой, товары с фильтрацией и многое другое.
  • Контактная форма 7 – Блок для отображения и выбора контактной формы.

Как работать с Гутенберг?

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

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

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

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

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

Вот видео для иллюстрации:

Объяснение как работает Гутенберг. Credit: WordPress.org

Как отменить или удалить Гутенберга?

Если вам не понравился редактор контента или вы хотите переключиться на классический редактор контента, у вас есть 2 способа сделать это:

  • Выберите «классический» блок – существует блок, который называется классическим блоком, и после его добавления вы можете просто работать со старым редактором контента как с блоком. Это просто и удобно, и для него не нужно скачивать плагины.
  • Загрузите старый плагин текстового редактора – если вам неудобно использовать этот блок или есть страницы, которые не работают с новым редактором контента, вы можете загрузить классический редактор контента в качестве плагина по этой ссылке. Вы также можете получить доступ к области плагинов в Консоль > Новый плагин > в текстовом поле введите «Classic Editor».

После загрузки этого плагина вы можете редактировать сообщения в одном из редакторов контента. Вы также можете установить классический плагин по умолчанию, перейдя в «Настройки» > «Написание» и выбрав этот плагин по умолчанию.

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

Добавить комментарий

      Leave a reply

      Нетолинк Netolink
      Logo