Home

🔷 Блок: Spacer / Отступ

📌 Что это

Spacer — это блок Gutenberg для добавления пустого пространства между элементами страницы.

То есть он не показывает текст, картинку или линию.
Он просто создаёт расстояние.

Например:

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

Простыми словами:

Spacer = пустой вертикальный отступ.

⚙️ Функции

Блок позволяет:

добавить пустое пространство;
настроить высоту отступа;
увеличить расстояние между блоками;
уменьшить расстояние между блоками;
визуально разделить части страницы;
создать “воздух” в дизайне;
добавить CSS-класс в Advanced.

Обычно главная настройка Spacer — это Height / Высота.

Например:

20px
40px
80px
120px

🎯 Зачем нужен

Чтобы страница не выглядела слишком тесной.

Например, если блоки стоят слишком близко:

Заголовок
Текст
Кнопка
Следующая секция

Можно добавить Spacer:

Заголовок
Текст
Кнопка

[пустое пространство]

Следующая секция

Так страница становится легче для восприятия.

📍 Где используется чаще всего

лендинги;
главная страница;
страницы услуг;
портфолио;
блоговые статьи;
инструкции;
CTA-блоки;
между секциями;
после hero-блока;
перед футером.

⚠️ Важно

Spacer — это не контент, а технический дизайн-блок.

Он нужен только для расстояния.

То есть:

Spacer = пустое место

Он не добавляет линию, текст или фон.

⚠️ Spacer или Separator?

Они оба помогают разделять контент, но делают это по-разному.

Spacer добавляет пустое пространство:

[пустое место]

Separator добавляет видимую линию:

────────────

То есть:

Spacer = разделение воздухом
Separator = разделение линией

⚠️ Не злоупотребляй Spacer

Spacer полезен, но им легко переборщить.

Плохо:

Заголовок

[Spacer 100px]

Текст

[Spacer 100px]

Кнопка

[Spacer 100px]

Так страница может стать слишком растянутой и неудобной.

Лучше использовать Spacer только там, где обычных отступов блока недостаточно.

⚠️ Лучше сначала использовать настройки отступов

Во многих случаях лучше сначала настроить:

Padding
Margin
Block spacing

у блока Group, Stack, Row или Columns.

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

Пример правильной логики:

Для секции → Group + padding
Для расстояния между элементами внутри Stack → Block spacing
Для отдельной паузы между блоками → Spacer

⚠️ Мобильная версия

Большие Spacer могут плохо выглядеть на телефоне.

Например, на компьютере отступ 120px может выглядеть красиво.
А на телефоне он может создать слишком большую пустоту.

Поэтому после добавления Spacer лучше проверить страницу в мобильном режиме.

⚠️ Тема может влиять

Возможности Spacer могут зависеть от темы и версии WordPress.

Тема может влиять на:

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

Если настроек мало — это нормально. Spacer сам по себе очень простой блок.

🧠 Простыми словами

Spacer — это блок для пустого пространства.

Если нужно просто добавить расстояние между блоками — используй Spacer.

Если нужна линия — используй Separator.
Если нужно управлять отступами целой секции — лучше использовать Group и настройки Padding / Margin.