Коротко
Свой код можно добавить в трех местах конструктора: в секции Пользовательский код внутри страницы, в настройках Пользовательский CSS и в настройках Пользовательский Javascript. Поля для вставки кода в раздел head вашего магазина нет. Для тегов в head используйте подходящее приложение (см. список ниже).
Какой инструмент для какой задачи
- Подтвердить магазин в Google Search Console или добавить мета-тег
google-site-verification: приложение Domain Verifier. Оно также подтверждает домен для Facebook (Meta), TikTok и Snapchat. - Google Analytics, теги Google Ads или любой тег, которым вы управляете в Google Tag Manager: приложение Google Tag Manager.
- Пиксели Facebook, TikTok, Snapchat, ChatGPT, Pinterest, X или Google Ads: см. Facebook, TikTok, Snapchat, ChatGPT, Pinterest и X или Конверсии Google Ads.
- Фид товаров для Google Merchant Center: см. Google Merchant Center. Для Search Console используйте Domain Verifier.
- Тепловые карты и записи сеансов: см. Microsoft Clarity или Contentsquare.
- Виджет или встраиваемый элемент внутри страницы (форма бронирования, видео, карта): секция пользовательского кода, описанная ниже.
- Стили для всего магазина или одной секции: см. Пользовательский CSS.
- Скрипт на каждой странице: см. Пользовательский JavaScript.
Почему код в конструкторе не подтверждает ваш сайт
При подтверждении Google, Meta и другие платформы ищут свой тег в head вашей страницы. Секция пользовательского кода размещает код в теле страницы, там, где находится секция. Пользовательский Javascript выполняется в браузере покупателя после загрузки страницы. Ни то, ни другое не помещает тег в head так, как нужно этим платформам, поэтому подтверждение не проходит. Domain Verifier сам добавляет тег в нужное место.
Секция пользовательского кода
Это секция, которую можно добавить на любую страницу, до 2 на страницу. Откройте вкладку Секции, нажмите Добавить новую секцию и выберите Пользовательский код. В ней три поля:
- HTML: разметка, которая показывается внутри этой секции.
- CSS: стили, которые действуют только на эту секцию, поэтому они не могут сломать остальную страницу.
- JavaScript: выполняется каждый раз, когда показывается секция. Ваш код получает секцию как
container, поэтому используйтеcontainer.querySelector(...), чтобы обратиться к своей разметке.
Также можно задать ширину, цветовую схему и отступы, как у любой секции. Используйте Применить ко всем страницам, чтобы скопировать ее на другие страницы, где уже есть секция пользовательского кода.
Советы
- Проверьте код в предпросмотре конструктора, затем опубликуйте и протестируйте магазин на телефоне и компьютере.
- Если после изменения страница выглядит сломанной, удалите код, опубликуйте и возвращайте его по частям.
- Сторонние скрипты могут замедлять магазин. Добавляйте только то, что нужно.
- ИИ-ассистент, подключенный к вашему магазину, может менять пользовательский код, только если владелец магазина это разрешил. См. Управление доступом ассистента.