Дополнительные CSS и JavaScript
Для специалиста: как сохранить свой CSS или JavaScript, выбрать момент загрузки и отключить неудачное изменение.
Эта инструкция предназначена для специалиста, который знает CSS и JavaScript. Штатные редакторы находятся в Дарнео: Маркет → Для разработчиков → Пользовательский код. Доступ требует прав на изменение модуля и редактирование PHP в Битриксе.
Код выполняется в браузерах покупателей и может повлиять на каталог, формы и оформление заказа. Для изменения цвета, логотипа и плотности сначала проверьте штатные настройки оформления. Для Метрики, GA4 и чата используйте готовые интеграции.
Подготовьте изменение
Сохраните копию текущего кода вне редактора и проверьте новое поведение на тестовом магазине. Меняйте по одной задаче за раз — так проще определить, какая правка повлияла на страницу.
На странице «Пользовательский код» есть флажок «Разрешить включение пользовательского JavaScript и CSS». Для публикации своего кода его нужно включить и сохранить. Без этого подтверждения код можно хранить выключенным, как черновик.
Добавьте CSS
- В строке CSS нажмите «Редактировать».
- Вставьте правила в «Исходный CSS».
- Для черновика оставьте «Включён» выключенным. Для публикации включите его после проверки кода.
- Нажмите «Сохранить».
- Дождитесь публикации витрины и откройте изменённую страницу заново.
CSS подключается после стилей решения и участвует в первом отображении страницы. Неудачное правило может изменить размеры кнопок, скрыть поле или ухудшить работу на телефоне. Выключенный CSS остаётся сохранённым, но в новую публикацию не включается.
Добавьте JavaScript
В строке JavaScript нажмите «Редактировать».
Для нового блока заполните «Стабильный ID», например store-widget,
и понятное «Название». ID начинается со строчной латинской буквы,
содержит от 2 до 64 знаков; допустимы строчные латинские буквы, цифры и дефисы.
После сохранения ID не меняется.
Выберите «Вид блока»:
- «Свой JavaScript» — вставьте код в поле «JavaScript», без тегов
script. - «Внешний адрес скрипта» — укажите HTTPS-адрес файла или путь этого же сайта. Для внешнего скрипта доступен флажок «Загружать асинхронно».
Внешний файл остаётся под управлением его владельца: он может изменить содержимое по тому же адресу. Выбирайте источник, которому доверяете.
Выберите категорию согласия
«Аналитика» и «Маркетинг» ждут разрешения посетителя соответствующей категории. «Необходимые» позволяют запускать код до любого выбора: используйте эту категорию только для функций, которые должны работать всегда. Порядок выбора описан в статье о согласии на внешние сервисы.
Выберите момент загрузки
| «Когда загружать» | Поведение |
|---|---|
| «Сразу после согласия» | Запускает блок, как только его категория разрешена. |
| «После полной загрузки страницы» | Ждёт загрузки документа и разрешения категории. |
| «В свободное время браузера» | Откладывает запуск до свободного времени браузера с учётом согласия. |
| «При первом действии посетителя» | Ждёт действия посетителя и разрешения категории. |
| «Только по вызову из кода» | Оставляет запуск вашему коду. Вызов тоже проверяет согласие. |
Для ручного запуска предусмотрен вызов:
window.darneoStorefrontAnalyticsV1
.loadCustomScript('store-widget');Вызывайте его после появления объекта интеграций.
Замените store-widget на ID своего блока.
Поздняя загрузка уменьшает работу при открытии страницы, но сервис может пропустить ранние события. Выберите режим под его назначение, включите «Включён», сохраните блок и дождитесь публикации.
Ограничения редакторов
Один блок собственного JavaScript и поле CSS принимают до 60 000 байт каждый. Общий объём исходников ограничен 480 000 байт. Текущий размер и доступное место показаны в редакторе. Это размер в байтах, а не число символов.
Блок JavaScript загружается один раз в открытом документе. Переходы между страницами магазина могут происходить без его перезагрузки. Если скрипт должен реагировать на каждый переход, специалист должен учесть это в коде. Список штатных событий находится в Для разработчиков → События аналитики.
Проверьте и при необходимости отключите
После публикации проверьте каталог и карточку товара, корзину, оформление заказа, вход и отправку форм. Повторите проверку на телефоне, при разрешённой категории и при отказе от неё. Сравните скорость открытия страниц и проверьте ошибки браузера.
Если изменение мешает покупателю, откройте соответствующий редактор, снимите «Включён», сохраните и дождитесь новой публикации. Перезагрузите страницу и проверьте восстановление работы. Уже открытая вкладка может продолжать исполнять ранее загруженный код.
Для временного отключения не используйте «Удалить пользовательский код»: эта команда с подтверждением удаляет все сохранённые исходники JavaScript и CSS. Черновик удобнее сохранить выключенным, исправить и проверить отдельно.