Getwid – настраиваемые блоки WordPress для редактора Gutenberg

В этой статье мы рассмотрим плагин Getwid. Он является одним из лучших плагинов WordPress для расширения возможностей редактора Gutenberg.

Содержание

Что такое Getwid?

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

Список блоков Getwid для редактора Gutenberg

Вот список блоков Gutenberg, доступных при использовании плагина Getwid:

  • Раздел.
  • Медиа и текстовый слайдер.
  • Слайдер изображений.
  • Иконка.
  • Блок значков.
  • Баннер.
  • Аккордеоны.
  • Вкладки.
  • Переключатель.
  • Галерея изображений.
  • Карты Google.
  • Блок недавно опубликованных постов.
  • Расширенный заголовок.
  • Блок изображения.
  • Группа кнопок.
  • Индикатор.
  • Круговой прогресс бар.
  • Счетчик.
  • Ценник.
  • Форма обратной связи.
  • Карусель постов.
  • Слайдер постов.
  • Пользовательский тип записи.
  • Прайс-лист.
  • Блок MailChimp;
  • Видео во всплывающем окне;
  • Обратный отсчет.

Как установить плагин Getwid

В панели администрирования WordPress перейдите в раздел Плагины. > Добавить Новый.

С помощью встроенного поисковика найдите плагин и нажмите кнопку «Установить».

После этого активируйте плагин.

Добавление новой страницы

В панели администрирования WordPress перейдите в меню Страницы. > Добавить новую.

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

В разделе «Атрибуты страницы» набор доступных параметров может быть разным в зависимости от используемой темы оформления.

Добавление блоков в редактор Gutenberg с помощью плагина Getwid

В редакторе Gutenberg нажмите кнопку со знаком «+», прокрутите вниз до раздела «Блоки Getwid» и выберите необходимый блок. Например, добавьте блок «Секция».

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

Справа от страницы располагаются настройки раздела. Вот их краткое описание:

  • Размер – здесь можно задать размеры раздела.
  • Отступы – настройка отступов вокруг созданного раздела для настольных компьютеров, планшетов и мобильных устройств.
  • Поля – добавьте поля вокруг созданного блока раздела для различных устройств.
  • Выравнивание – вертикальное и горизонтальное выравнивание созданного раздела для различных устройств.
  • Цвет фона – здесь можно добавить любой цвет фона для созданного раздела.
  • Фоновый градиент – эта опция позволит создать фоновый градиент для вашего раздела. Она пригодится в том случае, если вы не хотите использовать однотонный фон.
  • Фоновое изображение – здесь можно добавить фоновое изображение в созданный раздел вместо использования фоновых цветов.
  • Фоновый слайдер – фоновые слайдеры в разделы страницы. Как здорово.
  • Фоновое видео.
  • Передний план – добавьте эффекты переднего плана для созданного вами раздела.
  • Разделители (Dividers) – добавьте разделители между блоками.
  • Анимация входа (Entrance Animation) – благодаря использованию плагина Getwid вы сможете анимировать различные разделы так, как вам нравится.
  • Дополнительно (Advanced) – здесь вы сможете добавить привязку к HTML и классам CSS.

Слайдер мультимедиа и текста

Чтобы добавить блок слайдера мультимедиа и текста, кликните по значку «+», прокрутите до раздела «Блоки Getwid» и кликните по пункту «Слайдер медиа и текста».

С помощью этого блока вы сможете загрузить медиафайлы и добавить текст.

Краткий обзор доступных параметров настройки блока:

  • General – здесь можно указать количество слайдов, размер изображения, высоту слайдера, ширину содержимого, а также выравнивание по вертикали и горизонтали.
  • Цвет текста.
  • Цвет наложения – вы сможете установить необходимый цвет наложения и прозрачность.
  • Отступы – добавление отступов вокруг медиафайлов и текста.
  • Настройки слайдера – здесь вы сможете добавить анимацию к слайдеру и включить слайд-шоу.
  • Анимация текста – анимируйте текст на слайдерах.
  • Дополнительно – добавление пользовательских классов CSS.

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

Слайдер изображений

Добавьте на страницу блок «Слайдер изображений».

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

Доступно несколько вариантов настройки:

  • Параметры изображения – на этой вкладке можно установить размер изображения, автоматически обрезать его. А также связать каждое изображение с файлом мультимедиа или веб-страницей.
  • Настройки слайдера – здесь вы сможете указать количество слайдов, которые необходимо отображать на различных устройствах. Например, на настольном компьютере, ноутбуке, планшете и смартфоне.
  • Настройки управления – на этой можно указать, где необходимо отображать навигационные стрелки и точки.
  • Дополнительно – здесь можно будет добавить пользовательский класс CSS.

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

Блок баннера

Этот блок позволяет размещать рекламу на WordPress-сайте.

После добавления в блок баннера медиа-файла вы получите доступ к нескольким вариантам настройки.

С их помощью вы сможете добавить ссылку в баннер и открывать ее в новой вкладке.

Другие блоки для редактора Gutenberg от плагина Getwid

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

Данная публикация представляет собой перевод статьи «Getwid – Customizable WordPress Blocks for Gutenberg» , подготовленной дружной командой проекта Интернет-технологии.ру

Меню