Готовый шаблон Битрикс с маркетплейса решает задачу быстро: скачал, привязал домен, наполнил контентом - и через несколько часов сайт уже выглядит презентабельно. Но у типового решения фиксированная сетка блоков, чужой фирменный стиль под перекраску и жёсткая структура страниц, которая начинает мешать ровно тогда, когда бизнес просит нестандартный каталог, отдельный личный кабинет или посадочную страницу под конкретную рекламную кампанию. На практике я всё чаще собираю битрикс шаблон с нуля по готовому дизайн-макету и подключаю его к движку как самостоятельный шаблон сайта. Расскажу, из каких файлов он состоит, как переносится вёрстка и когда переход на свой шаблон окупается, а когда хватит доработки готового.
Когда типового шаблона Битрикс не хватает
Готовые решения вроде тем из маркетплейса 1С-Битрикс закрывают типовые сценарии: каталог товаров, блог, формы обратной связи, базовая адаптивность под мобильные экраны. Для быстрого старта интернет-магазина или корпоративного сайта это рабочий вариант, и я сам предлагаю его клиентам, если бюджет и сроки в приоритете.
Проблемы начинаются, когда:
- дизайнер отрисовал макет с нестандартной сеткой, а тема завязана на свою систему колонок и брейкпоинтов;
- нужен нетиповой раздел - например, отдельная страница с калькулятором или личный кабинет с виджетами, которых нет в комплекте;
- клиент хочет визуально отличаться от десятков сайтов на том же решении - готовые темы часто различаются только цветом и логотипом;
- правки в вёрстке накапливаются настолько, что проще собрать шаблон заново, чем каждый раз обходить чужую структуру файлов.
В таких случаях я беру HTML-макет и превращаю его в самостоятельный шаблон Битрикс, а не пытаюсь встроить нестандартный блок в чужую тему.
Из чего состоит шаблон в 1С-Битрикс
Шаблон в Битрикс - это папка в /local/templates/имя_шаблона/ со стандартным набором файлов:
header.php- открывающая часть страницы: doctype, подключение$APPLICATION->ShowHead(), шапка сайта, меню;footer.php- подвал, подключение скриптов и закрывающие теги;template.php- опционально, если структура страницы отличается от связки header плюс footer плюс контент;style.cssиtemplate_styles.php- стили и переменные оформления, которые редактируются через визуальный редактор дизайна;.description.php- имя шаблона и превью для админки;- папка
components- собственные шаблоны компонентов, переопределяющие вывод каталога, новостей, форм; - папка
page_templates- альтернативные разметки для отдельных типов страниц, например посадочной без меню и подвала.
Контент между header.php и footer.php Битрикс подставляет автоматически: ядро само решает, что вывести на конкретной странице, опираясь на структуру раздела сайта и настройки компонентов. Задача вёрстальщика - сделать так, чтобы это содержимое ложилось в разметку без конфликтов стилей.
Как перенести HTML-макет в шаблон Битрикс
Перенос статичной вёрстки в рабочий шаблон обычно занимает 3-5 дней на средний сайт из 8-12 уникальных типов страниц. Порядок такой:
- Разбить макет на переиспользуемые части - шапку, подвал, боковые блоки - и развести их по header.php и footer.php.
- Подключить системные вызовы Битрикс вместо статичного текста:
$APPLICATION->ShowTitle()для заголовка страницы,$APPLICATION->ShowPanel()для панели администратора,ShowHead()для мета-тегов и подключаемых стилей. - Вывести меню через компонент
menu.topс собственным шаблоном компонента, а не зашивать пункты меню в HTML вручную - иначе структура меню перестанет управляться из админки. - Подключить CSS и JS не напрямую в head, а через
template_styles.php,template_scripts.phpили менеджер ресурсов\Bitrix\Main\Page\Asset- это даёт контроль над порядком подключения файлов при кэшировании страниц. - Проверить отображение на всех типах страниц: главная, раздел каталога, карточка товара, форма, страница 404 - на каждой Битрикс может подставлять разный набор компонентов.
Здесь и вылезают основные баги: забытый брейкпоинт в CSS-сетке, меню, которое не подсвечивает активный раздел, или подвал, съезжающий на страницах без сайдбара.
Бесплатный материал
🎁 Полезный скрипт в подарок
Подпишитесь на Telegram - пришлю готовый скрипт по этой теме.
Без спама. Отписка в 1 клик.
Подключение компонентов и инфоблоков к своей вёрстке
Разметка - это только каркас, а контент на сайте выводят компоненты Битрикс: каталог, новости, формы, инфоблоки. Чтобы они легли в кастомный шаблон, а не выглядели вставкой из чужой темы, я переопределяю шаблоны конкретных компонентов - кладу свою версию в /local/templates/имя_шаблона/components/bitrix/имя_компонента/имя_шаблона_компонента/. Ядро само подхватывает файл из этой папки вместо стандартного шаблона компонента, если он там есть, - переопределять ядро руками не нужно.
Для интернет-магазинов почти всегда приходится точечно дорабатывать вывод карточки товара и корзины. У Битрикс это штатный модуль торгового каталога, но вёрстка карточки, галереи изображений и блока с ценой почти никогда не совпадает один в один с макетом дизайнера. На одном из проектов клиент отдельно просил сохранить фирменную вёрстку карточки при подключении оплаты через эквайринг Т‑Банка и расчёта доставки СДЭК - оба модуля в Битрикс штатные, но интерфейс их виджетов пришлось встраивать в существующую сетку, а не подгонять дизайн под виджет.
Готовый шаблон или своя вёрстка: как выбрать
| Критерий | Готовый шаблон с маркетплейса | Своя вёрстка |
|---|---|---|
| Срок запуска | 1-3 дня на установку и настройку | от 2 недель на разработку и вёрстку |
| Уникальность дизайна | ограничена цветовой схемой и логотипом | полностью под макет дизайнера |
| Нестандартные блоки и страницы | требуют доработки поверх чужой структуры файлов | закладываются сразу в структуру шаблона |
| Стоимость правок через год-два | чем больше отклонений от исходной темы, тем дороже каждая новая правка | правки укладываются в изначально понятную структуру файлов |
Если сайт нужен за несколько дней и брендинг не приоритет, готовый шаблон - рабочий вариант, я сам его рекомендую под такие задачи. Если сайт - лицо бренда и на нём завязана реклама, свою вёрстку в итоге приходится делать в большинстве таких проектов, неважно, сразу или через полгода после того, как готовая тема надоест и начнёт визуально сливаться с конкурентами на той же теме.
Сколько стоит и как долго делается шаблон под ключ
Сроки зависят от объёма: посадочная страница с 3-4 экранами и одной формой обычно закрывается за 1-2 недели, интернет-магазин с каталогом, карточкой товара, личным кабинетом и корзиной - от 4 до 6 недель с учётом интеграции оплаты и доставки.
Стоимость я считаю по конкретному макету и списку компонентов, которые нужно переопределить - фиксированной цены разработки шаблона нет, потому что толщина технического задания сильно отличается от проекта к проекту: где-то это перенос статичной вёрстки в 10 файлов, а где-то - переопределение половины компонентов каталога и личного кабинета. Для точной оценки по конкретному макету и списку интеграций проще взять консультацию по разработке шаблона - за 3 000 ₽ разбираю макет и говорю реальные сроки и бюджет, а не среднюю температуру по рынку.
1С-Битрикс регулярно обновляется, поэтому перед внедрением я сверяюсь с актуальной документацией.
Частые вопросы
Можно ли доработать готовый шаблон Битрикс вместо вёрстки с нуля?
Да, если отклонения от исходного дизайна умеренные - смена цветов, перестановка блоков, добавление одной нетиповой страницы. Я обычно смотрю макет и говорю, укладывается ли задача в доработку темы или выгоднее сразу собрать отдельный шаблон - это экономит время в будущем, если правок предвидится много.
Подойдёт ли своя вёрстка для интернет-магазина с большим каталогом?
Да, ограничений со стороны шаблона нет - каталог обслуживает модуль торгового каталога и инфоблоки, а шаблон только отвечает за то, как это выводится на экране. При больших объёмах я отдельно проверяю производительность вывода списков и настраиваю кэширование компонентов, чтобы страницы раздела не тормозили при тысячах товаров.
Что будет с шаблоном при обновлении Битрикс?
Файлы в /local/templates/ не затрагиваются обновлениями ядра и модулей - это одна из причин, по которой кастомные шаблоны в Битрикс размещают именно в local, а не в bitrix/templates. Обновления могут менять параметры или разметку конкретных компонентов, поэтому после крупных обновлений модуля каталога я перепроверяю переопределённые шаблоны компонентов на реальных страницах.
Сколько времени занимает переход с готового шаблона на свою вёрстку на работающем сайте?
Зависит от того, сколько уникальных типов страниц использует текущий сайт. На практике смена шаблона без остановки продаж занимает от 2 до 4 недель: сначала собираю новый шаблон и тестирую его на копии сайта, потом переключаю в проде и слежу за тем, что все компоненты и формы продолжают работать под новой вёрсткой.