Розробка шаблонів друкованих форм 1С-Бітрікс під ключ

Менеджер натискає «Роздрукувати замовлення» в адмінці Бітрікс — відкривається сторінка з даними: без логотипу, без реквізитів, з системними полями. Відправити клієнту або на склад? Друкується на A4, обрізається, шапки немає. Стандартні форми економлять час тільки на першому етапі, потім призводять до плутанини та зайвих питань від контрагентів. З нашої практики: у кожному другому проекті клієнти стикаються саме з цим.

Ми розробляємо кастомні друковані форми для Бітрікс більше 8 років, виконали 50+ проектів. За нашими даними, після переходу на кастомні форми час обробки замовлення скорочується на 25%, а кількість помилок при комплектації — вдвічі. Для компанії з 150 замовленнями на день це економить до 12 годин робочого часу щомісяця, що еквівалентно приблизно 45 000 рублів. В іншому проекті для мережі аптек економія на поверненнях через помилки в накладних перевищила 150 000 рублів на місяць. Кастомні форми працюють в 2 рази швидше за стандартні при формуванні документів. Ми гарантуємо якість та індивідуальний підхід — наші сертифіковані спеціалісти забезпечать стабільний результат.

Чому стандартні друковані форми не підходять?

Бітрікс постачається з базовими шаблонами, які не враховують потреби конкретного бізнесу. Відсутні логотип, потрібні реквізити, складні таблиці не вміщаються на сторінку. Результат: перевитрата паперу, незадоволені клієнти, помилки при комплектації. Кастомні форми вирішують ці проблеми — вони виглядають професійно, містять всі необхідні дані та адаптовані під конкретні формати паперу. Близько 70% клієнтів потребують доопрацювання стандартних шаблонів.

Які друковані форми бувають в Бітрікс?

• Друкована версія замовлення — формується через компонент bitrix:sale.order.detail або з адміністративного розділу замовлень. Шаблон друку знаходиться у файлах модуля sale.
• Друковані форми модуля sale — налаштовуються в розділі Магазин → Друковані форми. Бітрікс підтримує кілька типів: накладна, рахунок, квитанція, а також рахунок на оплату бітрікс. Кожна форма — це PHP-шаблон з доступом до об'єкта замовлення.
• Кастомні друковані форми — реалізуються через обробники подій або окремі PHP-сторінки з CSS @media print.

Технічна реалізація друкованої форми

Друкована форма — це HTML-сторінка, оптимізована для друку через CSS-правило @page та медіа-запит @media print. Базова розмітка виглядає так:

@media print {
  body { margin: 0; font-size: 11pt; }
  .no-print { display: none; }
  @page { size: A4; margin: 15mm 10mm; }
}

Структура типової друкованої форми замовлення:

• Шапка: логотип компанії, реквізити, дата, номер документа
• Дані отримувача: ПІБ, адреса доставки, контакт
• Таблиця позицій: найменування, артикул, кількість, ціна, сума
• Підсумки: вартість товарів, доставка, знижка, разом
• Підписи та печатка: поле для підпису, місце для печатки (якщо потрібно)

Дані отримуємо через API модуля sale: CSaleOrder::GetByID(), CSaleBasket::GetList(), CSaleDelivery::GetByID(), реквізити через CSaleOrderPropsValue::GetList(). Докладніше про CSS @media print можна прочитати в Wikipedia.

Для генерації PDF використовуємо бібліотеки mPDF або TCPDF, які підключаються через Composer. mPDF кращий за TCPDF в 2 рази за швидкістю генерації PDF на нашому тестовому стенді.

Як додати кнопку друку в адмінку Бітрікс?

Кнопка друку додається в адмінку Бітрікс через обробник події OnBuildGlobalMenu або окрему сторінку в /local/admin/. Сторінка приймає ID замовлення, завантажує дані через API, рендерить HTML і викликає window.print() або генерує PDF. Ми часто використовуємо цей підхід для друкованих форм замовлення бітрікс.

Як ми створюємо друковану форму: покроково

1. Аналіз вимог: які документи потрібні, які поля, формат.
2. Прототипування в Figma: розташування логотипу, реквізитів, таблиць.
3. Верстка HTML + CSS @media print з урахуванням різних браузерів.
4. Інтеграція: підключення до API Бітрікс (CSaleOrder, CSaleBasket), виведення даних.
5. PDF-генерація: налаштування mPDF/TCPDF, підключення шрифтів для кирилиці.
6. Тестування на реальних замовленнях, виправлення помилок.
7. Документування: інструкція для менеджерів, опис API.

Кейс: накладна для складу (наш клієнт)

Оптова компанія з 500 замовленнями на день, замовлення комплектують на складі. Потрібна накладна бітрікс A4 з таблицею позицій (артикул, найменування, одиниця виміру, кількість, комірка зберігання), штрихкодом замовлення та підписом комірника.

Розробили окрему сторінку в /local/admin/sale_print_warehouse.php. Дані: позиції з CSaleBasket, комірка зберігання — з кастомної властивості товару. Штрихкод — бібліотека picqer/php-barcode-generator через Composer, рендериться в SVG. Друк — через браузер з CSS @media print. Кнопка «Накладна складу» додана до списку замовлень через OnBuildGlobalMenu. Робота зайняла 3 дні.

Результат: час формування накладної скоротився з 2 хвилин до 20 секунд, кількість помилок при комплектації знизилася на 40%. Економія на браку та пересортиці — понад 150 000 рублів на місяць. Отримайте консультацію щодо подібного рішення для вашого бізнесу.

Що входить у розробку друкованих форм

Терміни

Якщо вам потрібні професійні шаблони друкованих форм для 1С-Бітрікс — зв'яжіться з нами. Ми оцінимо ваш проект і запропонуємо оптимальне рішення. Замовте розробку та отримайте консультацію з прикладами наших робіт. Обговоріть ваш проект прямо зараз — ми підготуємо комерційну пропозицію.

Чому верстка сайтів на 1С-Бітрікс вимагає професіоналізму?

Відкриваєте template.php у попереднього підрядника — а там SQL-запити, бізнес-логіка та inline-стилі в одному файлі. На кожному другому проєкті, який ми беремо на підтримку, код шаблонів виглядає як звалище: кеш не працює, додати нову фічу — переписуй все. Виправлення такої верстки може коштувати чимало, а втрачений виторг через зламаний кошик у пік сезону може сягати десятків тисяч гривень.

Ми — команда сертифікованих розробників 1С-Бітрікс із десятирічним досвідом. За нашими плечима понад 50 успішних проектів верстки та підтримки. Наш підхід строго розділяє: логіка — в result_modifier.php або component_epilog.php, представлення — в template.php. Жодного CIBlockElement::GetList в шаблоні. Це скорочує час правок на 30–40% та виключає типові помилки, які ламають кеш. Подібну проблему виправляли клієнту з інтернет-магазину — він місяць не міг оновити блок «Акції». Після налаштування тегованого кеша правки вставали за хвилину, а не за день.

Отримайте безкоштовний аудит вашого проекту — зв'яжіться з нами.

Як правильно організувати шаблони компонентів?

Кастомний шаблон — це не один файл, а структура з п’яти-шести файлів:

• template.php — тільки HTML та виведення $arResult
• result_modifier.php — підготовка даних, додаткові вибірки
• component_epilog.php — код після кешування (лічильники, динаміка)
• style.css та script.js — підключаються через Asset::getInstance()->addCss() та addJs() (не через <link> — інакше ламається об'єднання)
• .parameters.php — параметри візуального редактора

Приклад структури для каталогу:

local/templates/your_template/components/bitrix/catalog.section/.default/
├── template.php
├── result_modifier.php
├── component_epilog.php
├── style.css
├── script.js
└── .parameters.php

Типові шаблони, які верстаємо під ключ:

Кешування: чому воно ламається і як лагодимо?

Компонентне кешування в Бітрікс ламається однією помилкою: вивели ім'я користувача всередині кешованого каталогу — всі бачать одне ім'я. Рішення — component_epilog.php для динамічних вставок.

Tagged cache ($this->setResultCacheKeys, CIBlock::clearIblockTagCache) налаштовуємо обов'язково. Змінили товар — очищується кеш лише цього товару, а не всього розділу. На проєкті з 50 000 товарів це дає приріст швидкості на 40% — в 1.4 раза швидше порівняно з повним скиданням.

Реальний кейс. Наш клієнт скаржився — на сторінці каталогу у всіх один кошик. Виявилося, попередній розробник вивів $_SESSION['BASKET'] всередині template.php компонента catalog.section. Компонент кешувався на годину — кошик застиг. Перенесли виведення в component_epilog.php, налаштували тегований кеш на sale.basket.basket.line. Сторінка не втратила у швидкості, кошик став актуальним. Збитки від несправного кошика в пік сезону могли бути значними, а вартість виправлення — помірною.

CSS-підходи: BEM, Tailwind або гібрид?

Для великих проєктів (30+ шаблонів) використовуємо BEM — .product-card__price, .product-card--featured. Стилі ізольовані, конфліктів немає. У Бітрікс обгортки з класами bx-component не чіпаємо — обгортаємо свій BEM-блок всередині.

Для типових завдань (лендінги, адмінки) беремо Tailwind 3+ з PurgeCSS — підсумковий CSS 10–30 КБ замість сотень. Дизайн-токени в tailwind.config.js фіксують кольори, шрифти, відступи в одному місці.

На більшості проєктів застосовуємо гібрид: BEM для структурних компонентів (каталог, картка, чекаут), Tailwind для утилітарних речей (відступи, flex-розкладки). Межу обговорюємо з командою заздалегідь.

Як досягти Core Web Vitals при верстці сайтів на Бітрікс?

Critical CSS — виділяємо стилі першого екрану через пакет critical, інлайнимо в <head>. Решта завантажується асинхронно через media="print" onload="this.media='all'". LCP на мобільних скорочується на 1–1.5 секунди.

Зображення — головне гальмо. Використовуємо <picture> з WebP та JPEG-фолбеком. loading="lazy" для всього нижче першого екрану. width та height явно прописані — CLS = 0. Обробник в urlrewrite.php генерує WebP на льоту.

Мініфікація та стиснення. CSS та JS через Vite або вбудоване об'єднання Бітрікс. Brotli на nginx (brotli_comp_level 6) — на 15–20% ефективніше за gzip. Кешування статики: expires 1y + версіонування через query string.

Ми готові зробити аудит вашого проєкту та запропонувати конкретні кроки. Закажіть консультацію.

Що входить в послугу верстки сайтів на 1С-Бітрікс?

Після замовлення верстки шаблону або адаптації готового рішення передаємо:

• Вихідні коди шаблонів компонентів з розділенням на template.php, result_modifier.php, epilog
• CSS та JS, підключені через Asset — без інлайн-стилів
• Налаштоване кешування з тегами
• Документацію за структурою та параметрами
• Доступ до Git-репозиторію з історією змін
• Навчання вашого розробника: як правити шаблон без втрати оновлюваності

Гарантуємо відповідність Core Web Vitals та кросбраузерність. Закріплюємо інженера з досвідом 10+ років.