Безкоштовний плагін «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