Как добавить QR-код на сайт 1С-Битрикс: блок, страница, виджет

Алексей вёл сайт клиники на 1С-Битрикс: QR на странице записи вели на старую форму. Перешли на динамический QR в gr-s.ru - ссылку меняют в кабинете, картинка на сайте та же. Ниже - как добавить QR-код на сайт Битрикс: блок, страница, виджет и когда хватит редактора без программиста.

QR на сайте - изображение PNG (или SVG) со ссылкой внутри или динамическим редиректом через gr-s.ru. Посетитель сканирует с экрана или с распечатки лендинга. Для смены акции без правки HTML используйте динамический QR - как в гайде по динамическим QR.

По данным Яндекс Вордстат на июль 2026 года, запрос "как добавить qr код на сайт" набирает порядка 620 показов в месяц. Ниже - статичная картинка vs виджет, вставка в контент Bitrix, SSL и обновление без правки страницы.

1. Статичная картинка vs динамический виджет

Два рабочих подхода для сайта на 1С-Битрикс.

Подход	Когда подходит	Обновление ссылки
PNG в контенте	Разовая акция, редко меняется	Новый PNG + замена в редакторе
Динамический QR gr-s.ru	Акции, A/B, аналитика сканов	Кабинет gr-s.ru, сайт не трогаем
Компонент/блок в шаблоне	QR в футере на всех страницах	Include-область или настройки компонента

Типичная ошибка: вставить статический QR на временную акцию на год. Через месяц ссылка мертва, а править страницу страшно.

Рекомендация: для лендингов и акций по умолчанию выбирайте динамический QR. Статичный PNG - только если URL не изменится.

2. Генерация в gr-s.ru и вставка в контент

Базовый путь - в инструкции по генератору. Для сайта Bitrix:

1. Создайте QR в кабинете gr-s.ru с динамической короткой ссылкой.
2. Скачайте PNG достаточного размера (для экрана - от 200×200 px).
3. В админке Bitrix откройте нужную страницу или новость.
4. В визуальном редакторе нажмите "Вставить изображение".
5. Загрузите PNG в медиабиблиотеку сайта.
6. Добавьте подпись alt: "QR-код - запись на приём" (пример).
7. Сохраните страницу и откройте её с телефона - проверьте скан.

На практике контент-менеджер справляется за 10-15 минут без доступа к FTP.

Лендинг на конструкторе Bitrix: если страница собрана в Landing 24, блок "Изображение" работает так же - загрузите PNG из gr-s.ru, выровняйте по центру колонки, добавьте текстовый блок "Отсканируйте для записи" под картинкой. Не дублируйте QR в мобильной и десктопной версии разными файлами - один динамический код на обе.

Нюанс: не растягивайте маленький PNG на всю колонку. Размер на экране 150-250 px по ширине достаточен для скана с монитора. Для печати страницы в PDF используйте правила из гайда по размеру QR для печати.

3. Блок и include-область в 1С-Битрикс

Если QR нужен в футере, сайдбаре или на всех страницах раздела - одной вставки в статью мало.

Include-область (включаемая область):

• создаётся в разделе "Контент" админки Bitrix;
• один раз кладёте HTML с картинкой QR;
• подключается в шаблоне сайта - QR появляется везде, где вызвана область;
• контент-менеджер меняет картинку в одном месте.

Компонент в шаблоне: для каталога, лендинга на конструкторе или кастомного блока "Скачайте приложение" разработчик выносит QR в отдельный include-файл или параметр компонента. Это уже задача для интегратора, не для ежедневной правки текста.

Виджет vs картинка: под "виджетом" на сайте чаще всего имеют в виду не iframe с генератором, а блок с QR и подписью, который подключается из include-области. Генерация остаётся в gr-s.ru, на сайте - только готовый PNG и короткая ссылка внутри кода. Так проще кешировать страницу и не тянуть сторонний JavaScript.

Например, на сайте клиники QR "Запись" стоит в include-области футера. Сменили форму записи - обновили цель в gr-s.ru, PNG не меняли. Сделайте отдельный QR для футера и для баннера акции - так в аналитике видно, откуда пришёл скан.

Рекомендация: не вставляйте QR напрямую в PHP-шаблон без include, если им будут управлять маркетологи. Дайте им область в админке. Избегайте правки ядра шаблона ради одной картинки.

SSL, мобильная вёрстка и скорость

QR на сайте ведёт на URL. Если сайт без HTTPS, часть браузеров покажет предупреждение после скана.

• включите SSL-сертификат на домене (Let's Encrypt на хостинге);
• целевая страница после скана тоже должна открываться по HTTPS;
• на мобильном QR не прижимайте к краю экрана - оставьте отступы;
• сжимайте PNG в WebP через медиабиблиотеку или плагин оптимизации;
• стабильная отдача статики важна на shared-хостинге - см. ниже про Beget.

Типичная ошибка: QR ведёт на http-страницу, а сайт уже на https - смешанный контент или редирект ломает аналитику.

Рекомендация: проверьте цепочку: скан QR с десктопа страницы → открытие лендинга на телефоне в LTE.

Аналитика сканов с сайта

Отдельный QR на блок "Скачать с сайта" позволяет считать сканы в gr-s.ru - см. гайд по аналитике.

• создайте QR с меткой "site_footer" или "landing_promo";
• не смешивайте с QR на печатных флаерах - разные коды;
• сравните сканы с сайта и с офлайна по неделям;
• при A/B лендинга смените цель в кабинете, картинка на сайте та же.

В результате вы получите цифры по каналу "сайт" без доработки Яндекс.Метрики под QR. Сможете оценить, кликают ли по блоку или только сканируют с экрана.

4. Когда заказать доработку на mvmolkov.ru

Редактора достаточно для одной страницы. Разработчик нужен, если:

• QR должен подставляться из свойства товара или раздела каталога;
• нужен виджет "показать QR акции" по расписанию;
• QR генерируется автоматически для каждой карточки товара (массово - см. пакетная генерация);
• интеграция с CRM: скан → лид в Битрикс24;
• кастомный блок на конструкторе landing Bitrix с полями в админке.

Интеграции и доработки под 1С-Битрикс - профиль автора: Мольков Максим, разработчик 1С-Битрикс и автор gr-s.ru.

Рекомендация: опишите задачу: где QR, кто меняет ссылку, нужна ли аналитика. Это сэкономит итерации.

5. Хостинг: стабильная отдача статики

QR-картинка на странице - обычный файл на сервере. Если хостинг отдаёт медленно, страдает не скан, а общее впечатление от лендинга после перехода.

Для небольших сайтов на Bitrix подойдёт надёжный shared-хостинг с SSL и быстрой отдачей статики, например Beget - проверьте тариф под нагрузку каталога.

• включите кеширование в Bitrix (композит или стандартный кеш);
• храните QR в /upload/iblock/ через медиабиблиотеку;
• не грузите 2 МБ PNG - достаточно 20-50 КБ при 400×400 px.

Рекомендация: после переноса на новый хостинг проверьте скан QR со страницы и время открытия целевого URL.

QR с логотипом на корпоративном сайте

Если сайт на фирменных цветах, QR можно брендировать - см. инструкцию по QR с логотипом. На странице Bitrix это тот же PNG из gr-s.ru: загрузите в медиабиблиотеку, не пережимайте повторно в редакторе - иначе теряется читаемость модулей.

• логотип в центре QR - только из кабинета gr-s.ru, не рисуйте поверх в Photoshop;
• контрастная рамка вокруг кода на тёмном фоне шаблона;
• проверьте скан после любого сжатия WebP в плагине оптимизации.

Рекомендация: сделайте тестовую страницу в черновике, отсканируйте с трёх телефонов, затем публикуйте блок в прод.

Обновить QR на сайте без правки HTML

Алгоритм для динамического QR:

1. На сайте остаётся тот же PNG, что напечатали при первой публикации.
2. В кабинете gr-s.ru меняете целевой URL.
3. Очищаете кеш страницы в Bitrix, если кешируется весь HTML блока (картинка та же).
4. Скан с телефона - новая страница открывается.

Контент-менеджер не открывает визуальный редактор и не рискует сломать вёрстку.

Типичные ошибки QR на сайте Bitrix

Ошибка 1: QR только на десктопной версии, на мобильной блок скрыт CSS.

Ошибка 2: статический QR на акцию, забыли снять блок после окончания.

Ошибка 3: картинка без alt и подписи - плохо для доступности.

Ошибка 4: вставка через внешний hotlink - картинка пропала при смене домена.

Рекомендация: храните PNG в медиабиблиотеке своего сайта, не на чужом CDN без контроля.

Признаки, что QR на сайте работает

• скан с экрана монитора и с распечатки страницы ведёт на нужный URL;
• HTTPS без предупреждений;
• смена акции через gr-s.ru без правки HTML;
• на мобильной версии QR виден и читается;
• при необходимости сканы видны в аналитике gr-s.ru.

Материал проверен: Мольков Максим (разработчик 1С-Битрикс, автор сервиса gr-s.ru).
Источники и даты: dev.1c-bitrix.ru; gr-s.ru; частотность - Яндекс Вордстат, 14.07.2026.

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

Нужен ли SSL для QR со ссылки на сайт?

Да. Сайт и целевая страница должны открываться по HTTPS. Иначе браузер и сканер могут показать предупреждение.

Как обновить QR на сайте без правки HTML?

Используйте динамический QR в gr-s.ru. Меняете URL в кабинете, PNG на сайте остаётся.

Можно ли вставить QR без программиста?

Да, для одной страницы - через визуальный редактор и медиабиблиотеку Bitrix.

Где разместить QR на лендинге?

Блок "Скачать приложение", футер, рядом с CTA-кнопкой. Размер на экране 150-250 px.

Нужен ли отдельный компонент?

Только если QR на всех страницах или из свойств каталога. Иначе хватит include-области.

Какой размер PNG для сайта?

400×400 px с запасом, на странице показывайте 150-250 px. Файл до 50 КБ.