Редактор Wix: встраивание стороннего сайта или виджета
Отображайте контент из внешних источников, встраивая фрагмент кода или URL-адрес на сайт. Вы можете использовать встраивание для создания виджетов, которые улучшают ваш сайт, например виджетов погоды и акций, или для отображения внешних сайтов на странице.
Содержание
- Вставка кода на сайт
- Настройка встраивания
- Настройка размера отображаемого контента
- Рекомендации по вставке кода на сайт
Вставка кода
Добавьте код на сайт прямо из панели «Добавить элементы». Вы можете выбрать, добавить ли фрагмент кода на сайт или встроить внешний URL-адрес.
Чтобы вставить код на сайт:
- Нажмите Добавить элементы в редакторе.
- Нажмите Вставить код.
- Нажмите Популярные вставки.
- Выберите тип кода:
- Вставка HTML: вставьте фрагмент кода для отображения виджета на страницах сайта и настройте его.
- Вставка сайта: отобразите внешний сайт в окне на странице.
- Нажмите на выбранную вами вставку, чтобы добавить ее на сайт.
Настройка вставки
После добавления вставки введите соответствующий фрагмент кода или URL-адрес, чтобы настроить его и отобразить сайты и виджеты для посетителей.
Чтобы ввести код / URL:
- Нажмите на вставку в редакторе.
- Выберите соответствующий вариант, чтобы ввести данные:
- HTML:
- Нажмите Вставить код.
- Введите фрагмент в разделе Добавьте код.
- Нажмите Ввести адрес сайта.
- Введите URL в поле Веб-адрес сайта.
- Отображаются только коды HTTPS и URL-адреса.
- Некоторые сайты имеют настройки безопасности, которые запрещают их встраивание на внешние платформы (такие как Wix). В результате они не будут отображаться во вставке после добавления URL-адреса. Это контролируется внешним кодом сайта, и это невозможно обойти в Wix.
- Мы не можем обеспечить поддержку внешнего кода, который не были создан и протестирован Wix. Если у вас возникли проблемы с таким кодом, обратитесь напрямую к его разработчику.
Настройка размера отображаемого контента
Встроенные элементы часто содержат заранее определенные ширину и высоту в пикселях, установленные службой, из которой они были получены, как в примере ниже:
Эти настройки могут потенциально обрезать контент, если размер контейнера iFrame меньше, чем 560 * 315 пикселей. Чтобы этого не произошло, замените значения в пикселях на процентные единицы и установите их на 100%, как показано ниже:
Примечание
Элементы HTML и URL в редакторе — это фреймы. Следовательно, код или сайт, который вы встраиваете, не будут адаптивными, даже если они являются таковыми изначально.
Рекомендации по добавлению вставок кода на сайт
При встраивании кода или URL-адреса на сайт следует учитывать несколько важных рекомендаций, чтобы обеспечить правильное отображение элемента:
- Код должен быть совместим с HTML5. Большинство браузеров не отображают страницы и скрипты должным образом, если они были написаны с использованием более старых версий HTML.
- Нет ограничений по количеству символов для элементов HTML и встраивания сайта.
- Код должен содержать HTTPS, а не HTTP.
- HTML-документы описываются HTML-тегами. Теги HTML обычно идут парами, например и . Первый тег в паре — это начальный тег; второй тег — конечный. Этот формат тегов имеет решающее значение для поддержания структуры страницы, которую вы хотите вставить.
- Вставьте код на мобильную версию сайта, чтобы отобразить нужный контент и для тех, кто просматривает ваш сайт с телефона.
- Улучшите свой сайт с помощью собственных функций дизайна и возможностей CSS, используя пользовательские элементы.
Как встроить собственный код на сайт?
Wix не предоставляет поддержку по техническим вопросам со сторонними фрагментами кода. Если у вас возникли проблемы с фрагментом кода, пожалуйста, свяжитесь с провайдером напрямую.
Вы можете встроить пользовательский фрагмент кода в заголовок или основную часть страниц вашего сайта, чтобы подтвердить право собственности на сайт, отслеживать трафик вашего сайта, отслеживать активность пользователей и измерять эффективность ваших кампаний.
При добавлении пользовательского кода вы можете включить его на все страницы вашего сайта или только на определенные страницы. Что бы вы ни выбрали, эти фрагменты всегда невидимы для посетителей вашего сайта.
Подробнее:
- Добавление пользовательского кода на сайт
- Работа со сторонним кодом
Добавление собственного кода на сайт
Важно:
Прежде чем начать, убедитесь, что сайт опубликован и к нему подключен домен.- Перейдите в Настройки в панели управления сайтом.
- Перейдите на вкладку Пользовательский код в разделе Дополнительно.
- Нажмите +Добавить код в правом верхнем углу.
- Вставьте фрагмент кода в текстовое поле.
- Введите название вашего кода.
Совет: дайте ему легко узнаваемое название, чтобы вы могли быстро идентифицировать его позже. - Выберите вариант в разделе Куда добавить код?:
- На все страницы: код будет добавлен на все страницы вашего сайта, включая любые новые страницы, которые вы создадите в будущем. Выберите, загружать ли код только один раз за посещение или на каждой странице, которую открывает ваш посетитель.
- Выбрать конкретные страницы: используйте выпадающее меню для выбора соответствующих страниц.
- Выберите, где разместить код в разделе Поместить код:
- Голова
- Body — начало
- Body — Конец
- Нажмите Сохранить.
- Ваши фрагменты кода связаны с определенным доменом. Если вы назначаете своему сайту другой домен, фрагмент кода будет удален. Нет необходимости добавлять фрагменты кода ко второму домену, так как весь трафик перенаправляется на ваш основной домен.
- Чтобы помочь вашему сайту соответствовать таким законам о конфиденциальности, как GDPR, мы рекомендуем вам классифицировать свой собственный код.
Работа со сторонним кодом
Когда вы получаете фрагмент кода от третьего лица, он должен дать вам инструкции о том, где разместить код (заголовок или тело) и как его использовать. Расположение кода имеет решающее значение для его правильной загрузки и выполнения.
Wix не предоставляет поддержку для технических проблем, которые могут возникнуть со сторонними фрагментами кода. Если у вас возникли проблемы с фрагментом кода от стороннего разработчика, обратитесь за помощью напрямую к поставщику кода.
Хотите встроить видимый код?
Добавьте iFrame с кодом HTML для отображения визуального контента на сайте. Если вы хотите, чтобы элементы сайта взаимодействовали с вашим сайтом, а также для получения дополнительных функций, таких как создание веб-приложений, перейдите на Velo by Wix.
Добавление HTML-кода в пост блога Wix
Используйте HTML, чтобы встроить iframe (внешний код или компоненты) в пост блога или отобразить внешний сайт.
Важно:
Обязательно ознакомьтесь с ограничениями элемента HTML перед его использованием.
Чтобы добавить HTML-код в пост блога:
- Перейдите в Блог в панели управления сайтом.
- Нажмите Редактировать в соответствующем посте блога или Создать новый пост, чтобы написать новый.
- Нажмите Добавить слева.
- Нажмите HTML-код.
- Выполните одно из следующих действий:
- Добавить HTML-код: добавляет функции с внешних сайтов с помощью HTML-кода.
- Нажмите HTML-код.
- Введите свой HTML-код.
- Нажмите Сохранить.
- Вставить внешний сайт: отображает внешний сайт в окне поста.
- Нажмите Адрес сайта (URL).
- Введите URL-адрес.
- Нажмите Сохранить.
- Добавить HTML-код: добавляет функции с внешних сайтов с помощью HTML-кода.
- (Необязательно) Настройте элемент, используя параметры; ширина, высота и выравнивание.
Узнайте, как получить HTML-код со сторонних сайтов:
- SoundCloud — как вставить музыкальный трек
- Карты Google — вставка карты
- Instagram — вставка изображения
- Vine — вставка поста
- Twitter — встроить временную шкалу
- Pinterest — встроить функцию Pinterest
- Facebook — вставка постов
- VK — как встроить функцию ВКонтакте
Редактор Wix: О вставках кода на сайте
Добавляя вставки кода на сайт, вы можете отображать контент из внешних источников и различные инструменты, такие как функциональные виджеты, сторонние сайты, анимация и видео. Вы также можете использовать их для добавления маркетинговых интеграций и собственных расширенных функций для развития бизнеса и создания комплексно структурированных страниц сайта.
Важно
Ни один из этих инструментов не позволяет вам получить доступ к HTML вашего сайта или изменить его.Вставка сайтов и виджетов
Используйте популярные варианты вставки, доступные на платформе Wix, чтобы предоставить посетителям возможность использовать дополнительные инструменты, функции и сторонние сайты. Элементы HTML позволяют отображать различные виджеты, такие как календари и приложения о погоде.
Вы также можете использовать URL-адреса HTTPS для отображения внешних сайтов на своих страницах. Это полезно, если вы хотите дать посетителям возможность ознакомиться со связанными брендами или даже просто отобразить дополнительную информацию о компании или сайте, которые вы поддерживаете.
Примечание
См. наши рекомендации и ограничения встраивания HTML-кода в Wix.Добавление пользовательских элементов
С пользовательскими элементами, вы можете добавлять фрагменты кода для создания пользовательских HTML-тегов. Используйте их для создания собственных элементов и расширения возможностей вашего сайта за счет CSS. Вы можете применять теги как для создания собственных элементов, так и для создания взаимодействий с использованием прокрутки, динамического изменения высоты элементов и многого другого.
Пользовательские элементы можно использовать с любой библиотекой JavaScript ES6 или фреймворком, который работает с HTML 5, поэтому они отлично подходят для создания оригинальных страниц со сложным дизайном и функциями.
Совет
Обязательно ознакомьтесь с рекомендациями и ограничениями, если вы собираетесь добавлять пользовательский элемент.
Вставка видео и анимации
Вы можете оживить свой сайт и добавить ему интерактивности с помощью вставок с гибкими параметрами. Используйте одиночный видеопроигрыватель, чтобы вставлять любимые видео с таких платформ, как YouTube и Facebook, или загружать собственные ролики.
Вы также можете встроить элемент Lottie для демонстрации уникальной анимации на вашем сайте. Добавьте элемент на страницу и вставьте URL-адрес из своей учетной записи LottieFiles, чтобы создать интересный и привлекательный интерактивный элемент для посетителей сайта.
Добавляйте собственные функции с помощью Velo
Режим Velo для разработчиков предлагает вам расширенные возможности для создания сайтов. Работайте с нашими API и добавляйте JavaScript на сайт, чтобы создавать страницы с использованием продвинутых функций.
Вы сможете добавлять и редактировать свой код в нашей интегрированной среде разработки (IDE), доступной непосредственно в редакторе Wix и обеспечивающей проверку синтаксиса и базовый анализ кода.
Посетите наш портал Velo от Wix (на английском языке), чтобы получить дополнительную информацию и продолжить знакомство с Velo.
Встраивайте инструменты маркетинговой интеграции
Инструменты маркетинговой интеграции позволяют отслеживать эффективность работы сайта, вносить предложения по оптимизации и вести мониторинг рекламных кампаний, чтобы вы могли управлять сайтом и бизнесом в нужном вам формате.
Поскольку эти инструменты интегрированы с Wix, они меньше влияют на производительность сайта, и вам не нужно беспокоиться о размещении скриптов. Однако вы также можете вставить собственный код для маркетинговых и бизнес-инструментов.
Совет
Чтобы помочь вашему сайту соответствовать таким законам о конфиденциальности, как GDPR, мы рекомендуем вам классифицировать свой собственный код.
