Как в wix вставить html код

Как вставить код на сайт одним махом мышки

Знаете, в чем заключается одно из главных преимуществ редактора Wix? В том, что он дает возможность каждому создать свой сайт, не требуя никаких специальных знаний в области программирования. Это очень простая и интуитивная платформа, где можно легко добавлять, удалять, передвигать и всячески редактировать любые элементы, ни касаясь ни одной строки кода.

Но как быть, если вам необходимо добавить на сайт функцию, не предусмотренную в редакторе Wix? Как раз для этого мы разработали на вид простой, но на деле — мега-функциональный виджет HTML, о котором и расскажем вам сегодня. С помощью приложения HTML на сайт можно добавить буквально все (разве что кроме ёжиков – прим. ред.), включая любой вид стороннего контента, виджетов и приложений.

Как добавить форму в конструкторе сайтов WIX

Чтобы добавить форму на страницу сайта, созданного с помощью конструктора сайтов WIX, Вам необходимо зайти во вкладку «Получить код» в необходимой форме и скопировать код из поля «Код для вставки на сайт. Javascript (рекомендуем)»:

Далее перейдите в WIX в режиме редактирования Вашего сайта. Слева нажмите иконку «Добавить»:

Откроется меню, Вам необходимо выбрать пункт меню «Вставка кода» и «Вставка виджета»:

Отобразится блок HTML, нажмите шестерёнку «Настроить»:

Откроется всплывающее окно «Настройка HTML», где необходимо в поле «Добавьте код (только HTTPS)», вставить ранее скопированный код из нашего конструктора:

Нажмите кнопку «Применить». Разместите блок HTML, где Вам необходимо и форма будет готова к использованию:

Стоит сказать про передачу UTM меток в форму, которая встроена на WIX.

Wix использует заголовок strict-origin-when-cross-origin, который запрещает другим сайтам, отличным от исходного домена передавать Referer, а т.к. форма встраивается на сайте через дополнительный iframe, то внутри этого iframe уже нет информации о utm-метках. Единственным решением этой проблемы можно использовать вставку формы через GTM (Google Tag Manager), при котором форма размещается на сайте без дополнительного iframe.

Здесь мы рассматривали, как добавлять форму через Google Tag Manager.

После того, как Вы добавили через GTM форму указанным способом, то данный код добавляет форму в самый низ сайта. Чтобы добавить в заданный блок на сайте, Вам необходимо знать html ID этого блока.

Для этого нужно использовать вот такой код:

Где comp-kovfffzf — это HTML ID блока на сайте, куда будет добавлена форма.

Чтобы узнать ID блока, Вам необходимо открыть конструктор сайтов и добавить элемент «Текст»:

Выберите любой текст и пропишите что-нибудь или укажите, например, знак препинания «.»:

Мы для примера указали слово «Текст», чтобы было нагляднее. Сохраните изменения и опубликуйте. Откройте Ваш сайт, найдите добавленный блок (текст), нажмите правой кнопкой и выберите «Исследовать»:

Откроется инспектор, внешний вид может отличатся, в зависимости от того, какой Вы браузер используете. Вам необходимо подняться выше выбранного блока, т.е. найти тег , к какому классу он относится и нам нужно скопировать в код скрипта для GTM, такое значение из тега comp-kovfffzf, который является нашим HTML ID:

Теперь этот код, с Вашим значением HTML ID, добавьте в Google Tag Manager и на месте элемента (в качестве примера использовали «Текст»), будет отображена форма:

Лучше использовать какой-нибудь знак препинания, чтобы он был незаметен на Вашем сайте. Расположите этот блок в необходимом месте. Теперь значения UTM-меток будут передаваться при отправке формы, при таком способе добавления кода формы, с помощью Google Tag Manager.

Как встроить собственный код на сайт?

Wix не предоставляет поддержку по техническим вопросам со сторонними фрагментами кода. Если у вас возникли проблемы с фрагментом кода, пожалуйста, свяжитесь с провайдером напрямую.

Вы можете встроить пользовательский фрагмент кода в заголовок или основную часть страниц вашего сайта, чтобы подтвердить право собственности на сайт, отслеживать трафик вашего сайта, отслеживать активность пользователей и измерять эффективность ваших кампаний.

При добавлении пользовательского кода вы можете включить его на все страницы вашего сайта или только на определенные страницы. Что бы вы ни выбрали, эти фрагменты всегда невидимы для посетителей вашего сайта.

Подробнее:

• Добавление пользовательского кода на сайт
• Работа со сторонним кодом

Добавление собственного кода на сайт

Важно:
Прежде чем начать, убедитесь, что сайт опубликован и к нему подключен домен.

1. Перейдите в Настройки в панели управления сайтом.
2. Перейдите на вкладку Пользовательский код в разделе Дополнительно.
3. Нажмите +Добавить код в правом верхнем углу.
4. Вставьте фрагмент кода в текстовое поле.
5. Введите название вашего кода.
   Совет: дайте ему легко узнаваемое название, чтобы вы могли быстро идентифицировать его позже.
6. Выберите вариант в разделе Куда добавить код?:
   • На все страницы: код будет добавлен на все страницы вашего сайта, включая любые новые страницы, которые вы создадите в будущем. Выберите, загружать ли код только один раз за посещение или на каждой странице, которую открывает ваш посетитель.
   • Выбрать конкретные страницы: используйте выпадающее меню для выбора соответствующих страниц.
7. Выберите, где разместить код в разделе Поместить код:
   • Голова
   • Body — начало
   • Body — Конец
8. Нажмите Сохранить.

• Ваши фрагменты кода связаны с определенным доменом. Если вы назначаете своему сайту другой домен, фрагмент кода будет удален. Нет необходимости добавлять фрагменты кода ко второму домену, так как весь трафик перенаправляется на ваш основной домен.
• Чтобы помочь вашему сайту соответствовать таким законам о конфиденциальности, как GDPR, мы рекомендуем вам классифицировать свой собственный код.

Работа со сторонним кодом

Когда вы получаете фрагмент кода от третьего лица, он должен дать вам инструкции о том, где разместить код (заголовок или тело) и как его использовать. Расположение кода имеет решающее значение для его правильной загрузки и выполнения.

Wix не предоставляет поддержку для технических проблем, которые могут возникнуть со сторонними фрагментами кода. Если у вас возникли проблемы с фрагментом кода от стороннего разработчика, обратитесь за помощью напрямую к поставщику кода.

Хотите встроить видимый код?

Добавьте iFrame с кодом HTML для отображения визуального контента на сайте. Если вы хотите, чтобы элементы сайта взаимодействовали с вашим сайтом, а также для получения дополнительных функций, таких как создание веб-приложений, перейдите на Velo by Wix.

Добавление HTML-кода в пост блога Wix

Используйте HTML, чтобы встроить iframe (внешний код или компоненты) в пост блога или отобразить внешний сайт.

Важно:

Обязательно ознакомьтесь с ограничениями элемента HTML перед его использованием.

Чтобы добавить HTML-код в пост блога:

1. Перейдите в Блог в панели управления сайтом.
2. Нажмите Редактировать в соответствующем посте блога или Создать новый пост, чтобы написать новый.
3. Нажмите Добавить слева.
4. Нажмите HTML-код.
5. Выполните одно из следующих действий:
   • Добавить HTML-код: добавляет функции с внешних сайтов с помощью HTML-кода.
     1. Нажмите HTML-код.
     2. Введите свой HTML-код.
     3. Нажмите Сохранить.
   • Вставить внешний сайт: отображает внешний сайт в окне поста.
     1. Нажмите Адрес сайта (URL).
     2. Введите URL-адрес.
     3. Нажмите Сохранить.
6. (Необязательно) Настройте элемент, используя параметры; ширина, высота и выравнивание.

Узнайте, как получить HTML-код со сторонних сайтов:

• SoundCloud — как вставить музыкальный трек
• Карты Google — вставка карты
• Instagram — вставка изображения
• Vine — вставка поста
• Twitter — встроить временную шкалу
• Pinterest — встроить функцию Pinterest
• Facebook — вставка постов
• VK — как встроить функцию ВКонтакте