Хотите узнать, как создать карту с несколькими булавками с помощью Jet Elements?
Реактивные элементы предлагает виджет под названием Расширенная карта. В отличие от виджета Google Родные картыElementor который поддерживает только одно местоположение, Jet Elements Advanced Map Widget позволяет создавать карту с несколькими булавками.
Чтобы использовать этот виджет, необходимо сначала интегрировать Jet Elements с Google Карты с использованием ключа API.
Расширенный виджет карты Jet Elements весьма полезен, если у вас есть бизнес с несколькими филиалами в городе и вы хотите создать карту, показывающую расположение ваших филиалов. Этот виджет также полезен для создания чего-то вроде карты туристических достопримечательностей в городе.
Вот как использовать этот виджет.
Шаг 1. Интегрируйте JetElements с Google Maps
Как уже упоминалось, вам нужен ключ API Google Карты для интеграции Jet Elements с Google Maps. Вы можете получить ключ API через консоль Google API.
Так посетите Консоль API Google и войдите в свою учетную запись Google. Если у вас еще нет проекта, создайте новый, щелкнув раскрывающееся меню вверху и нажав НОВЫЙ ПРОЕКТ в появившемся всплывающем окне.
Дайте название вашему проекту и нажмите на кнопку СОЗДАТЬ .
После создания нового проекта выберите его в раскрывающемся меню в верхней части панели инструментов Google API Console, затем нажмите библиотека на левой панели.
Google делит API Карт Google на 17 типов. Чтобы использовать этот виджет, необходимо включить API-интерфейсы, необходимые для виджета расширенной карты Jet Elements. Crocoblock, разработчик Jet Elements, не предоставляет подробной информации о необходимых API. Исходя из нашего опыта, мы включили следующие API:
- API маршрутов
- API геокодирования
- Карты JavaScript API
- API мест
Вы можете нажать на ссылку ПОКАЗАТЬ ВСЕ в разделе Cartes чтобы увидеть их всех.
Чтобы активировать API, выберите соответствующий API (щелкнув по нему) и нажмите кнопку АКТИВИРОВАТЬ.
Завершив включение необходимых API, вернитесь на главную панель инструментов Google API Console и нажмите Идентификаторы на левой панели. Нажмите на кнопку Создать учетные данные и выберите Ключ API. Скопируйте ключ API в появившемся всплывающем окне.
Затем войдите в свою панель управления WordPress и перейдите в JetPlugins – > Настройки JetElements.
Нажмите на вкладку интеграций и вставьте свой ключ API в поле Ключ API Карт Google в разделе Google Maps. Активируйте опцию Отдельный ключ API геокодирования и вставьте тот же код на Ключ API геокодирования.
Шаг 2: Создайте карту
После успешной интеграции Jet Elements и Google Maps вы можете приступить к созданию карты. Для этого создайте новую страницу (Страницы –> Добавить) или новую статью (Предметы – > Добавить) и измените его с помощью Elementor.
В редакторе Elementor, установите макет, прежде чем начать. Для этого откройте панель «Настройки страницы», щелкнув значок шестеренки в левом нижнем углу. Выберите макет из раскрывающегося меню под опцией Общие настройки.
Добавьте новый раздел, щелкнув значок плюса в поле редактирования Elementor, и перетащите виджет «Расширенная карта» на холст.
Установите центр карты в свой город (или любой регион в зависимости от карты, которую вы хотите создать). Также установите начальный масштаб.
открытый Google Maps и найдите первое место, которое вы хотите добавить на карту, и скопируйте его адрес.
Вернитесь в редактор Elementor и откройте раздел Пальцы. Нажмите на существующее местоположение и замените адрес адресом, который вы только что скопировали. Также добавьте описание локации на поле Пин Описание.
Нажмите на кнопку ДОБАВИТЬ ЭЛЕМЕНТ расположенный чуть ниже, чтобы добавить еще один адрес.
Чтобы изменить стиль вашей карты, а также высоту, вы можете открыть раздел Стиль карты.
ПРИМЕЧАНИЕ: Если карта не загружается после перетаскивания виджета Расширенная карта в редакторе Elementor и вы увидите сообщение «Только для целей разработки», обязательно включите свой платежный аккаунт Google. облако. Новая политика Google требует, чтобы разработчики включили платежный аккаунт.
Получить Elementor Pro сейчас !!!
Заключение
Так ! Вот и все, что касается этой статьи, в которой показано, как создать карту с несколькими булавками с помощью Jet Elements. Если у вас есть какие-либо опасения по поводу того, как туда добраться, сообщите об этом в Комментарии.
Тем не менее, вы также можете проконсультироваться наши ресурсы, если вам нужно больше элементов для реализации ваших проектов создания интернет-сайтов, обратитесь к нашему руководству по Создание блога на WordPress или Divi: лучшая тема WordPress всех времен.
Но тем временем поделитесь этой статьей в разных социальных сетях.
...
