CMS: отображение адресов из элементов коллекции на Google Maps
10 мин.
Отображайте местоположения из элементов коллекции CMS (Content Management System) в интерактивном элементе Google Maps на сайте. Добавьте местоположения элементов в поле адреса в коллекции. Затем подключите карту на сайте к набору данных, который связан с вашей коллекцией.
Прежде чем начать:
Добавьте CMS (систему управления контентом) на свой сайт.
Добавление поля адреса в коллекцию CMS
Убедитесь, что для элементов коллекции, которые вы хотите отобразить на карте, введено местоположение в поле адреса. После подключения к карте эти местоположения отображаются в виде меток. Вы также можете подключить заголовки, описания, ссылки, текст ссылок и URL-адреса меток к полям коллекции.
Чтобы добавить поле адреса в коллекцию:
- Перейдите в CMS в панели управления сайта. Кроме того, вы можете нажать CMS
в редакторе, а затем нажать Ваши коллекции. - Нажмите на нужную коллекцию.
- Нажмите Управлять полями.
- Нажмите + Добавить поле.
- Выберите Адрес и нажмите Выбрать тип поля.
- Введите название в поле Название поля.
- (Необязательно только для Velo) Обновите ID поля, который используется в коде сайта. Вы не сможете обновить это поле позже.
- (Необязательно) Введите Текст подсказки, если вы хотите, чтобы в коллекции рядом с названием поля появлялась всплывающая подсказка.
- (Необязательно) Включите переключатель Личная информация, чтобы зашифровать данные о местоположении, которые могут считаться Личной информацией.
- Нажмите Сохранить.
- Введите местоположение для каждой позиции в поле адреса. Обязательно вручную выберите правильный адрес из списка, который появляется при вводе. Если вы не выберете адрес из списка, у Google Maps могут возникнуть проблемы с чтением и правильным отображением всех ваших адресов.
Подключение полей коллекции к карте
Подключите элемент Google Maps к набору данных, который связан с вашей коллекцией. Затем подключите поле адреса к местоположению на карте и выберите, какие поля использовать для остальных подключений. После подключения вы можете убедиться, что все местоположения находятся в поле зрения, настроив масштаб. Вы можете выбрать один из нескольких стилизованных дизайнов карт и настроить размер карты на странице.
редактор Wix
Редактор Studio
- Перейдите в редактор.
- Перейдите на страницу или в раздел, куда вы хотите добавить карту.
- Нажмите Добавить элементы
слева в редакторе. - Нажмите Контакты и формы и выберите Карты.
- Нажмите и перетащите соответствующий элемент Google Maps на страницу.
- Нажмите на иконку «Подключить к CMS»
. - Нажмите на выпадающий список Выберите набор данных и выберите существующий набор данных, который подключается к вашей коллекции. Кроме того, нажмите Добавить набор данных, затем выберите коллекцию, которую хотите подключить, дайте набору данных имя и нажмите Создать.
- В разделе Параметры подключения используйте выпадающие списки для подключения каждой части карты:
Совет: Нажмите на соответствующий выпадающий список и выберите + Добавить, если вам нужно создать и подключить новое поле коллекции.- Местоположение подключается к: Выберите поле адреса, которое вы хотите использовать для элементов.
- Заголовок подключается к: Выберите поле для использования в качестве заголовка, который отображается жирным шрифтом на карте.
- Описание подключается к: Выберите поле для использования в качестве описания, которое отображается под заголовком.
- Ссылка подключается к: Выберите поле URL, если вы хотите добавить ссылку под заголовком и описанием. Обязательно подключите выпадающий список Текст подключается к, который определяет текст ссылки, иначе ссылка не будет отображаться.
- Текст подключается к: Выберите поле для использования в качестве текста, который будет гиперссылкой для выпадающего списка Ссылка подключается к. Обязательно выберите значения в обоих списках, чтобы ссылка отображалась.
- Метка подключается к: Если вы хотите использовать собственную иконку вместо стандартного маркера Метка
, выберите поле URL, которое содержит URL-адрес вашей иконки. Мы рекомендуем использовать изображения размером менее 30 пикселей в ширину и высоту.
- Измените размер карты, нажимая и перетаскивая края. Вы также можете нажать на иконку Растянуть
, чтобы развернуть ее на всю ширину сайта. - Нажмите на иконку Настройки
на элементе Google Maps и выберите один из следующих вариантов:
- Масштаб: перетащите ползунок, чтобы изменить масштаб карты по умолчанию.
- Показать режим карты и спутника: позвольте посетителям переключаться между режимами карты и спутника.
- Показать управление масштабом: позвольте посетителям увеличивать и уменьшать масштаб карты.
- Показать управление просмотром улиц: позвольте посетителям выбирать Google Street View, чтобы увидеть местоположение с уровня земли.
- Показать ссылку «Маршруты»: позвольте посетителям нажать на ссылку, чтобы просмотреть маршруты в Google Maps.
- Разрешить перетаскивание: позвольте посетителям нажимать и перетаскивать карту для перемещения по ней.
- Нажмите на иконку Дизайн
, чтобы выбрать другой готовый дизайн карты.
Примечание. Вкладка Дизайн метки не влияет на метку карты после подключения карты к набору данных. Используйте выпадающий список Метка подключается к: на шаге 8, если вы хотите использовать собственную метку на карте.
Важно:
Если в вашей коллекции есть элементы, у которых нет местоположений в подключенном поле адреса, карта не будет отображать элементы коллекции. Вы можете решить эту проблему, добавив фильтр к набору данных. Установите фильтр для поля адреса и условие Не пусто. В результате набор данных будет считывать только те элементы, у которых есть местоположение, и отображать их на карте.
Часто задаваемые вопросы
Нажмите ниже, чтобы получить ответы на часто задаваемые вопросы о подключении Google Maps к CMS.
Можно ли показать на карте адреса, которые отправляют посетители?
Можно ли показать несколько адресов для одной и той же позиции коллекции?
За что отвечают настройки «Управление местоположениями»?