Разработка промо-сайта на 1С-Битрикс

Разработка промо-сайта на 1С-Битрикс

Промо-сайт — это короткоживущий или постоянный сайт под конкретный продукт, акцию, мероприятие. Главная его цель — конверсия: регистрация, заявка, покупка. Технически промо-сайт на Битрикс чаще всего означает одностраничник (лендинг) с несколькими секциями, формами захвата лидов и, опционально, интеграцией с Битрикс24.

Когда промо на Битрикс, а не на конструкторе

Битрикс выбирают для промо-сайта, если:

• Основной сайт уже на Битрикс — промо размещают на поддомене или в папке, используя ту же CMS.
• Нужна интеграция с CRM (Битрикс24) без лишних прослоек — формы сразу создают лиды.
• Промо-сайт планируется многократно использовать с разным контентом (акции, события).
• Контент промо должен редактироваться в редакторе Битрикс без разработчика.

Архитектура промо-сайта

Для промо на Битрикс возможны два подхода:

1. Отдельный шаблон на основном сайте. Создаётся новый шаблон в /local/templates/promo_EVENTNAME/. В header.php и footer.php — минимальная обёртка, без основного навигационного меню. Страница /promo/event-name/index.php подключает этот шаблон через $APPLICATION->SetTemplate().

2. Отдельный сайт в составном сайте. Если промо на поддомене promo.example.ru — создаётся новый сайт в административной части (Настройки → Сайты → Список сайтов). Свой шаблон, свои настройки, свои почтовые события.

Редактируемые секции через инфоблок

Чтобы маркетолог мог менять контент промо без разработчика — размещаем редактируемые блоки через инфоблок promo_sections:

// Секции промо-страницы
$sections = \CIBlockElement::GetList(
    ['SORT' => 'ASC'],
    [
        'IBLOCK_ID' => PROMO_SECTIONS_IBLOCK_ID,
        'ACTIVE'    => 'Y',
        'PROPERTY_PROMO_ID' => $promoId,
    ],
    false,
    false,
    ['ID', 'NAME', 'CODE', 'DETAIL_TEXT', 'PROPERTY_SECTION_TYPE', 'PROPERTY_BG_IMAGE', 'PROPERTY_CTA_TEXT', 'PROPERTY_CTA_URL']
);

Свойства элемента-секции: тип секции (hero, features, testimonials, cta, faq), фоновое изображение, текст CTA-кнопки, её URL. В шаблоне — switch по SECTION_TYPE, подключающий соответствующий include:

while ($section = $sections->GetNext()) {
    $sectionType = $section['PROPERTY_SECTION_TYPE_VALUE'];
    $sectionFile = __DIR__ . '/sections/' . $sectionType . '.php';
    if (file_exists($sectionFile)) {
        include $sectionFile;
    }
}

Формы захвата лидов

На промо-сайте несколько точек конверсии: форма в hero-секции, форма в конце страницы, всплывающая форма при попытке уйти (exit-intent). Все они отправляют данные на один обработчик:

// /local/ajax/promo_lead.php

\Bitrix\Main\Loader::includeModule('crm');

$promoId = htmlspecialchars($_POST['promo_id'] ?? '');
$name    = htmlspecialchars(trim($_POST['name'] ?? ''));
$phone   = htmlspecialchars(trim($_POST['phone'] ?? ''));
$email   = htmlspecialchars(trim($_POST['email'] ?? ''));

// Источник фиксируется для аналитики
$source = htmlspecialchars($_POST['form_position'] ?? 'unknown'); // hero | bottom | popup

if (empty($phone) && empty($email)) {
    echo json_encode(['error' => 'Укажите телефон или email']);
    exit;
}

$lead = new \CCrmLead(false);
$leadId = $lead->Add([
    'TITLE'              => 'Промо: ' . $promoId . ' — ' . $name,
    'NAME'               => $name,
    'PHONE'              => [['VALUE' => $phone, 'VALUE_TYPE' => 'WORK']],
    'EMAIL'              => [['VALUE' => $email, 'VALUE_TYPE' => 'WORK']],
    'SOURCE_ID'          => 'WEB',
    'SOURCE_DESCRIPTION' => 'Промо: ' . $promoId . ', форма: ' . $source,
    'UTM_SOURCE'         => $_COOKIE['utm_source'] ?? '',
    'UTM_MEDIUM'         => $_COOKIE['utm_medium'] ?? '',
    'UTM_CAMPAIGN'       => $_COOKIE['utm_campaign'] ?? '',
]);

echo json_encode(['success' => (bool)$leadId]);

UTM-метки. При заходе на промо-страницу — сохранять UTM в cookie через JS (30 минут). При отправке формы — передавать с запросом. В лиде Битрикс24 доступны поля UTM_SOURCE, UTM_MEDIUM, UTM_CAMPAIGN, UTM_TERM, UTM_CONTENT — используем их.

Таймер обратного отсчёта

Важный элемент промо — таймер до конца акции. Реализуется на JS с учётом серверного времени (не локального времени браузера):

// В шаблоне PHP передаём серверную дату окончания
$promoEndDate = '2026-04-01T23:59:59+03:00';
echo '<script>window.PROMO_END_DATE = "' . $promoEndDate . '";</script>';

// Timer component
function startCountdown(endDateStr) {
    const endDate = new Date(endDateStr);
    const timer   = setInterval(() => {
        const now  = new Date();
        const diff = endDate - now;

        if (diff <= 0) {
            clearInterval(timer);
            document.getElementById('timer').textContent = 'Акция завершена';
            return;
        }

        const days    = Math.floor(diff / 86400000);
        const hours   = Math.floor((diff % 86400000) / 3600000);
        const minutes = Math.floor((diff % 3600000) / 60000);
        const seconds = Math.floor((diff % 60000) / 1000);

        document.getElementById('timer-days').textContent    = String(days).padStart(2, '0');
        document.getElementById('timer-hours').textContent   = String(hours).padStart(2, '0');
        document.getElementById('timer-minutes').textContent = String(minutes).padStart(2, '0');
        document.getElementById('timer-seconds').textContent = String(seconds).padStart(2, '0');
    }, 1000);
}

A/B тестирование

Для промо-сайтов A/B тест критичен. Простая реализация без внешних сервисов: делим посетителей на группы через cookie.

// Определить вариант для пользователя
if (!isset($_COOKIE['promo_variant'])) {
    $variant = rand(0, 1) ? 'A' : 'B';
    setcookie('promo_variant', $variant, time() + 86400 * 30, '/');
} else {
    $variant = $_COOKIE['promo_variant'];
}

// Подключить нужный шаблон
$templateFile = __DIR__ . '/variants/' . $variant . '.php';
include $templateFile;

Результаты конверсии — через отдельный счётчик в таблице b_local_promo_ab_stats с полями: PROMO_ID, VARIANT, VIEWS, CONVERSIONS.

Кэширование и производительность

Промо-сайт может получить пиковый трафик (рассылка, рекламная кампания). Заранее настраиваем:

• Полностраничное кэширование через nginx FastCGI cache для анонимных пользователей.
• Cache-Control: public, max-age=3600 для статики.
• Предварительный прогрев кэша после деплоя.
• Ограничение AJAX-запросов на сервере (rate limiting nginx: limit_req_zone).

Сроки разработки