Как настроить блоки Gutenberg в WordPress для статей услуг?

Марина открыла «Записи → Добавить», увидела пустой экран и написала про услуги одним блоком «Абзац». На телефоне — стена букв, кнопки «Записаться» нет. Потом случайно поменяла общий блок с телефоном — номер сменился на всех пяти страницах. Блоки Gutenberg в WordPress — не программирование, а конструктор из кубиков. За вечер настройте каркас статьи услуги с кнопкой «Написать» и сохраните макет как паттерн — получите страницу, которую не стыдно открыть с телефона.

Редактор блоков Gutenberg — стандартный способ собирать страницы в WordPress: текст, кнопка и картинка — отдельные блоки. Для статьи услуги хватит «Абзац», «Заголовок», «Столбцы», «Кнопки», «Список». Каркас сохраняют как обычный паттерн, блок «Как связаться» — как синхронизированный, чтобы править контакты на всех страницах сразу.

Gutenberg — не код и не Elementor. Представьте набор деталей LEGO: заголовок, короткий ответ клиенту, три карточки «что входит», кнопку в мессенджер. Один раз собрали каркас — дальше меняете только текст и цены. Редактор блоков включён в WordPress с 2018 года; на большинстве сайтов в 2026 году отдельный плагин Gutenberg не нужен. Ниже — пошагово: первый экран, паттерны, проверка на телефоне.

Соберите первый экран: ответ и кнопка

Не делайте типичную ошибку — начинайте с длинного рассказа «о компании». Клиент зашёл узнать цену, а не читать биографию. Первый экран отвечает за три секунды: что за услуга, для кого, что делать дальше.

1. Откройте «Записи → Добавить» (блог) или «Страницы → Добавить» (лендинг услуги).
2. Нажмите «+» и добавьте «Абзац» — 2–3 предложения простым языком.
3. Под абзацом — блок «Кнопки»: ссылка на /kontakty/ или Telegram, текст «Написать», не «Позвонить».
4. Заголовок записи вверху — H1; внутри текста «Заголовок» H2 для секций.

На практике Марина наконец получила видимую кнопку: посетитель видит «Написать» до прокрутки. По рекомендациям для страниц услуг CTA не прячут вниз страницы — повторите кнопку после блока «Сколько стоит» и перед блоком с вопросами. Текст кнопки лучше глаголом: «Написать», «Узнать цену», «Записаться в мессенджер» — не «Подробнее» без действия.

Разложите услуги по блоку «Столбцы»

Один абзац на телефоне нечитаем — клиент уходит, не дочитав. Блок «Столбцы» делит экран на 2–3 карточки: картинка, заголовок H3, короткий текст. Для студии, мастерской или консультации этого хватает, чтобы показать пакеты, этапы работы или сравнить тарифы без таблицы в Excel.

1. «+» → «Столбцы», раскладка на 2 или 3 колонки.
2. В каждую: «Изображение», «Заголовок» H3, «Абзац» на 1–2 строки.
3. H2 «Что входит» над столбцами — так понимают структуру и люди, и поиск.
4. У изображений заполните alt: «маникюр гель-лак», не «IMG_4521».

В реальном проекте хватает трёх колонок: «Базовый», «Стандарт», «Премиум». Больше шести WordPress позволяет, но на телефоне они сложатся в одну — не перегружайте.

Добавьте секции по чеклисту страницы услуги

Пустой редактор пугает без списка «что куда класть». Каждый пункт каркаса — отдельный блок.

Схема: ответ + кнопка → H2 «Что входит» → H2 «Сколько стоит» + кнопка → H2 «Как проходит работа» → H2 «Примеры» → H2 «Частые вопросы».

Секции добавляйте через «+»: «Заголовок» для H2, «Список» для шагов, «Абзац» для пояснений. При вставке загляните во вкладку «Паттерны» — готовые макеты «услуги» или «цены» можно вставить и заменить текст. Не копируйте конкурентов слово в слово, но структуру H2 повторите: поисковик и нейросети любят понятные секции «что входит», «сколько стоит», «как заказать». Плагин Gutenberg в 2026 году нужен только для ранних функций — редактор уже в ядре WordPress.

Сохраните каркас как обычный паттерн

Чтобы не собирать страницу с нуля, выделите каркас без уникальных цен и сохраните как паттерн.

1. Выделите блоки от первого абзаца до «Как проходит работа».
2. «⋮» → «Создать паттерн» (в старых гайдах «Reusable block» — такого пункта уже нет).
3. Имя: «Статья услуги — каркас». Synced — выключен.
4. При следующей статье: «+» → «Паттерны» → вставка.

Обычный паттерн — чертёж: правите текст на одной странице, другие не меняются. Для каркасов «маникюр», «педикюр», «наращивание» с разными ценами — именно он. Управление сохранёнными паттернами: «Внешний вид → Редактор → Паттерны» или через меню при редактировании записи.

Разделите обычные и синхронизированные паттерны

С WordPress 6.3 «переиспользуемые блоки» стали синхронизированными паттернами: правка одного экземпляра меняет блок на всех страницах. Русскоязычные гайды 2024–2025 ищут «Reusable block» — в меню 2026 года нужен «Создать паттерн» с Synced.

Блок «Напишите в Telegram» сохраните с Synced включён — смена ссылки в одном месте обновит все статьи, где стоит паттерн. Перед правкой только на одной странице нажмите «Отсоединить паттерн», иначе снова случай Марины с номером на пяти страницах. В WordPress 6.6+ для синхронизированных паттернов есть «переопределения»: фиксируете макет кнопки, а заголовок и ссылку меняете отдельно на каждой услуге. Удобно для сетки отзывов или карточек с разными именами мастеров.

Итог: каркас — обычный паттерн; контакты — синхронизированный. Сомневаетесь — сначала «Отсоединить».

Проверьте порядок блоков и вид на телефоне

Избегайте вложенности: когда «Группа» стоит внутри «Группы», на мобильном отступы плывут. Держите структуру плоской.

1. Используйте Document Overview → List View — дерево блоков.
2. Порядок: ответ → кнопка → «Что входит» → цена → CTA → FAQ.
3. «Просмотр» на мобильном — столбцы в одну колонку, кнопка нажимается.
4. Уберите пустые абзацы между секциями.

Ctrl+K (Cmd+K на Mac) открывает палитру команд — быстрый поиск «Столбцы» или «Кнопки» без листания меню «+». Сохраните черновик, откройте страницу в режиме инкогнито и нажмите кнопку — так проверяют, что ссылка ведёт в мессенджер, а не на 404. У каждого «Изображение» заполните alt-текст: это помогает и слабовидящим, и поиску понять, что на картинке.

Как понять, что настройка сработала

• H1, короткий ответ в первом экране, «Столбцы» с 2–3 карточками.
• Две кнопки «Написать» на контакты или Telegram, без призыва звонить.
• Каркас — паттерн без Synced; «Как связаться» — синхронизированный.
• На телефоне нет горизонтальной прокрутки.

Если после правки синхронизированного CTA изменение видно на всех страницах услуг — паттерн работает как задумано. Это и есть признак, что вы настроили блоки Gutenberg под реальный сайт, а не просто набросали текст. Не хотите разбираться с паттернами сами — напишите через раздел услуг или форму на сайте (MAX, VK, WhatsApp, Телеграм) без обязательного созвона.

Что дальше

1. Сделайте черновик и не публикуйте, пока не пройдёте мобильный просмотр.
2. Вставьте синхронизированный CTA в конец каждой страницы услуг из вкладки «Паттерны».
3. Через неделю откройте одну статью с телефона и проверьте кнопку.
4. Другие гайды по WordPress — в разделе статей и в Телеграме.

Блоки Gutenberg — способ быстрее выпускать страницы, которые читают люди и находят в поиске. Один каркас, синхронизированный контактный блок, проверка на телефоне — и вы не рисуете сайт заново для каждой услуги.

Материал проверен: Андрей Дикий (создаёт сайты и продвигает их статьями, SEO/GEO).
Достоверность данных: справка WordPress Block Editor (2026-09-14), Synced Patterns на wordpress.org, Theme Handbook по паттернам, переопределения synced patterns (WP 6.6+), блок «Столбцы» на wordpress.com/ru; частотность — Яндекс Вордстат на 2026-09-19 (MCP недоступен).

Частые вопросы

Как настроить блоки Gutenberg в WordPress с нуля?

«Записи → Добавить», «+» и блоки «Абзац», «Кнопки», «Столбцы» по схеме выше. Редактор в ядре с WP 5.0 — плагин Gutenberg новичку не обязателен.

Какие блоки нужны для статьи про услугу?

«Абзац», «Заголовок», «Столбцы», «Кнопки», «Список», «Изображение». Для вопросов — список или блок «Подробнее» в теме.

Как сохранить шаблон статьи в Gutenberg?

Выделите блоки → «⋮» → «Создать паттерн». Каркас — без Synced; CTA — с Synced. Вставка: «+» → «Паттерны».

Чем reusable block отличается от pattern?

С WP 6.3 reusable block стал синхронизированным паттерном. Ищите «Создать паттерн» с переключателем Synced.

Как убрать лишние блоки в редакторе?

List View, клик по блоку, Delete. Пустые «Абзацы» между секциями удаляйте — раздувают отступы на мобильном.

Нужен ли плагин Gutenberg в 2026 году?

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

Статья или страница для услуги?

Блог — «Запись»; лендинг «заказать / цена» — «Страница». Блоки настраиваются одинаково.