Эта страница — демо всех стилей и блоков, которые хорошо смотрятся в теме Blocksy + Stackable. Каждый раздел помечен заголовком — смотри что нравится и возвращайся с пометками «это в каждую статью» / «это только для кейсов» и т.д.
1. Заголовки H2 — H5
H3 — подзаголовок внутри раздела
H4 — глубже в иерархии
H5 — редко нужен, для deep-детализации
В статьях обычно: H2 → H3. H4 — только если H3 раздел реально большой и требует внутренних подразделов.
2. Форматирование текста в абзаце
Обычный текст без форматирования — основа статьи, 16px, тёмный.
Полужирный — для ключевых тезисов. Курсив — для акцента, цитат, названий. Полужирный курсив — почти не используем. Ссылка — синяя, подчёркивается на ховере. inline-код — моноширинный, для API-эндпоинтов и имён полей. Выделение маркером — для самого важного. Зачёркнутый — для устаревшего. Сочетания клавиш через Ctrl+K.
3. Списки
Маркированный:
- Первый пункт списка с обычным текстом
- Второй пункт — можно выделить ключевое
- Третий пункт со ссылкой внутри
Нумерованный:
- Аудит текущего процесса — 1 неделя
- Настройка воронки — 2 недели
- Обучение команды — 1 неделя
- Перенос данных + запуск — 1 неделя
Вложенный список:
- Внедрение amoCRM
- Настройка воронки
- Интеграция телефонии
- Обучение менеджеров
- Внедрение Bitrix24
- CRM + задачи
- Подключение 1С
4. Цитаты и выделенные блоки
Обычная цитата — блок с вертикальной полосой слева. Хорошо для отзывов клиентов и ссылок на авторитетные источники.
Иван Иванов, директор продаж, «Компания X»
«Большая цитата-выноска» — визуально крупнее обычной, выделяет главную мысль статьи. Используй один раз на пост.
Виктор Фёдоров
Callout «Кратко.» — для TL;DR в начале статьи (светло-голубой фон, синий бордер слева):
Кратко. amoCRM лучше для чистых продаж — простая воронка и быстрое внедрение. Bitrix24 — комбайн для полной автоматизации, но дольше осваивается. ROI у amoCRM 2–3 мес, у Bitrix24 — 4–6 мес.
Callout «Важно» (жёлтый — под палитру бренда):
⚡ Важно. Не начинай внедрение CRM без аудита текущих процессов. В 80% случаев причина провала — не софт, а кривая бизнес-логика, которую «автоматизировали как есть».
Callout «Опасно» (красный, для предостережений):
🚫 Не делай так. Не подключай телефонию к CRM без настроенной воронки. Менеджеры захлебнутся в хаосе, а руководитель ничего не увидит в отчётах.
Callout «Совет» (зелёный):
✅ Совет из практики. Перед запуском CRM дай менеджерам 3 дня играть в «песочнице» — через неделю они полюбят систему, а не будут саботировать.
5. Таблицы
| Параметр | amoCRM | Bitrix24 |
|---|---|---|
| Цена старт. тариф | 499 ₽/мес за пользователя | бесплатно до 5 пользователей |
| Срок внедрения | 2–4 недели | 4–8 недель |
| Интерфейс | минималистичный | функциональный, но перегружен |
| Сложность освоения | 2–3 дня | 2–4 недели |
| Лучше для | отделов продаж | полной автоматизации бизнеса |
6. Код и pre-форматированный текст
Инлайн-код: используй wp_query, ct-button, #0077B5 для HEX-цветов.
// Пример кода — блок Code
function init_crm_webhook() {
$webhook_url = 'https://crm.example.com/api/v1/hooks';
return wp_remote_post($webhook_url, array(
'body' => json_encode($payload)
));
}ASCII-схема воронки: Лид → Квалификация → Встреча → КП → Согласование → Сделка ↓ ↓ ↓ ↓ ↓ ↓ тёплый нужен бюдж. назнач. выслано принято победа
7. Колонки (2 и 3)
amoCRM
Простая воронка, быстрое освоение, 350+ готовых интеграций. Для отделов продаж 5–50 менеджеров.
Bitrix24
CRM + задачи + сайты + документооборот. Для компаний, которым нужен единый инструмент.
🎯 Цель
чёткая и измеримая
📊 Метрика
только из CRM
⚙️ Процесс
повторяемый
8. Кнопки и CTA
9. Картинка с подписью
10. Сворачиваемый блок (FAQ / Details)
Сколько времени занимает внедрение amoCRM?
Средний проект — 2–4 недели. Базовую воронку и обучение можно сделать за неделю, но полноценная настройка с интеграциями и доработками занимает дольше.
Нужно ли обучать сотрудников отдельно?
Да, но это часть нашего внедрения — 2 онлайн-сессии по 1,5 часа + материалы для самостоятельного изучения + 2 недели саппорта после запуска.
11. Разделители
Обычный разделитель:
Разделитель «широкая линия»:
Разделитель «точки»:
12. Финальный CTA-блок
Нужен аудит или внедрение?
Напиши на sale@bizavtomat.ru или позвони +7 (923) 423-67-00. В течение дня разберём твою задачу и дадим оценку.
13. Карусели / галереи — 3 варианта
Вариант A. Core Gallery (сетка, без скролла) — базовый блок Gutenberg. Идеально если 3–6 картинок и они все должны быть видны сразу.
Вариант B. Горизонтальная прокрутка (CSS-карусель, без плагинов) — 4+ картинки в ряд с прокруткой пальцем на мобиле. Без JS, без зависимостей. Используется в кейсах, если картинок много.
↔ Прокрути горизонтально
Вариант C. Stackable Image Carousel (автопрокрутка + точки) — карусель-слайдер с автопрокруткой, стрелками и индикатором страниц. Когда хочется «как слайдшоу».
Примечание. Вариант C сработает, если у Stackable включён блок Carousel в настройках плагина. Если не отрисуется как слайдер — в редакторе поменяй блок на Stackable Image (из Add block → Stackable), он тоже умеет карусель-layout.