Бесплатный плагин «Spectra Legacy» добавляет в стандартный редактор блоков WordPress дополнительные блоки и настройки, а также набор готовых страниц и секций. Это поможет создавать более разнообразные страницы, не переходя на отдельный визуальный конструктор по типу Elementor.
Плагин разработала компания Brainstorm Force, которая также выпускает популярную тему Astra. Spectra особенно хорошо сочетается с ней, но без проблем будет работать и с другими темами. Подробнее о возможностях Astra мы рассказали в отдельной статье:
Статья на тему 👀
Обзор темы Astra
Дополнительные блоки Spectra
После установки Spectra в редакторе WordPress появится новый набор блоков. Их можно увидеть сразу после нажатия кнопки добавления нового блока. У стандартных блоков WordPress иконки чёрного цвета, у блоков Spectra — синего.
Более 30 новых блоков помогут создавать более сложные страницы с интерактивными элементами и сложными структурами секций. Условно блоки Spectra можно разделить на несколько категорий:
- Для создания структуры страницы:
- Контейнер;
- Вкладки;
- Аккордеон;
- Слайдер;
- Модальное окно.
- Для оформления контента:
- Заголовок;
- Кнопки;
- Иконка;
- Список с иконками;
- Информационный блок;
- Призыв к действию;
- Маркетинговая кнопка;
- Контактная форма;
- Разделитель;
- Цитата;
- Изображение;
- Галерея изображений.
- Для добавления отдельных элементов страницы:
- Часто задаваемые вопросы;
- Отзыв;
- Команда;
- Прайс-лист;
- Счётчик;
- Таймер обратного отсчёта;
- Звёздный рейтинг;
- Карта Google;
- Социальные кнопки.
- Для вывода публикаций и навигации по сайту:
- Сетка записей;
- Карусель записей;
- Временная шкала публикаций;
- Список рубрик;
- Оглавление.
Посмотреть полный список блоков и примеры их использования можно на официальном сайте Spectra. Для каждого блока разработчики подготовили отдельную страницу с описанием его возможностей.
Также у блоков Spectra ощутимо больше настроек оформления, чем у стандартных блоков WordPress. Это даёт возможность более тонко управлять внешним видом каждого блока. На боковой панели настройки расположены на трёх вкладках:
- General — размеры, выравнивание, общие параметры блока.
- Style — цвета, отступы, тени, параметры текста (шрифт, размер, высота строки).
- Advanced — анимации, отображение на устройствах, CSS-класс.
Один из самых полезных блоков, про который стоит сказать отдельно — «Контейнер». Это структурный блок, внутрь которого можно помещать другие блоки и собирать таким образом секции на сайте.
В стандартном редакторе WordPress тоже есть блоки для группировки элементов, но контейнер Spectra предоставляет больше настроек структуры и оформления. У нас есть отдельная статья, где мы описываем, как при помощи этого блока создавать секции с любой структурой.
Статья на тему 👀
Как создавать страницы в WordPress
Настройки стилей только для конкретной публикации
Spectra добавляет в редактор блоков WordPress собственную боковую панель, в которую можно добавлять свой CSS-код и он будет работать только для этой публикации.
Если вдруг вы не в курсе, при помощи CSS можно менять внешний вид любого элемента на странице: размеры, цвета, отступы, расположение и другие параметры. Это полезно, когда нужно изменить что-то, чего интерфейс редактора менять не позволяет.
Например, с помощью такого кода можно:
- скрыть ненужный элемент только на одной странице;
- изменить поведение блока при разном размере экрана;
- изменить ширину общей колонки с контентом только на этой странице.
Эта возможность пригодится пользователям, которые хотя бы немного знакомы с CSS. Для большинства стандартных изменений писать код не понадобится: блоки Spectra уже содержат визуальные настройки цветов, размеров, отступов, границ и других параметров.
Библиотека готовых страниц и секций
Spectra также добавляет на верхнюю панель редактора кнопку для открытия библиотеки с готовыми дизайнами, сделанными при помощи блоков плагина. В ней будет три вкладки:
- Patterns — макеты секций;
- Pages — макеты страниц;
- Kits — готовые сайты.
Готовые дизайны помогут сэкономить время при создании страниц, плюс их можно использовать как источник вдохновения: посмотреть, какие бывают секции, из каких элементов они состоят и как они сочетаются между собой.
Часть дизайнов доступна бесплатно, а для импорта некоторых макетов понадобится платная версия плагина — Spectra Pro.
Если библиотека шаблонов не нужна, её можно выключить в настройках Spectra. Раздел «Spectra Legacy – Settings – Editor Enhancements», опция «Enable Templates Button».
Панель с любимыми блоками
Ещё одна удобная опция Spectra — дополнительная панель в редакторе блоков, куда можно добавить часто используемые блоки, чтобы их не нужно было каждый раз искать в общем списке.
Активировать эту панель можно настройках Spectra. Раздел «Spectra Legacy – Settings – Editor Enhancements», опция «Enable Quick Action Bar».
Добавить блок на панель можно при помощи кнопки + в нижней её части.
Удалить блок с панели можно, если навести на блок мышкой и нажать крестик во всплывающей подсказке с названием блока.
Переставить блоки местами можно, нажав на иконку с изображением карандаша внизу на панели. После этого блоки можно будет перетаскивать.
Что дальше
Если вы создаёте сайт при помощи нашего руководства, чуть ниже будет на него ссылка, чтобы вы могли в него вернуться и продолжить. А если вы не знали, что у нас есть такое руководство, взгляните на него, там много полезных советов, а также ссылок на другие статьи и видео.
Статья на тему 👀
Как создать сайт на WordPress