Как в Elementor добавить Яндекс карту

Содержание

Добрый день коллеги на связи Павел Гречко. После прочтения статьи подписывайтесь на мои каналы в других пабликах. Сегодня помогу вам добавить яндекс карту в вордпресс+elementor.

Как создать Яндекс карту для сайта на WP

Для начала необходимо перейти в сервис Яндекса «Конструктор яндекс карт«. На главной странице заполните всю необходимую информацию, задайте название, укажите адрес местонахождение вашей фирмы.

Как в Elementor добавить Яндекс карту
Жмём создать карту
Как в Elementor добавить Яндекс карту
Пишем название вашей организации + ваш адрес. Пока всё просто.

После того когда вы укажете ваше местонахождение, появиться окно (если нет то нажмите на иконку на карте для редактирования) в нем необходимо указать метку, выбрать иконку, задать цвет. Далее нажмите желтую кнопку сохранить и продолжить.

Как в Elementor добавить Яндекс карту

Далее необходимо задать размеры карты в пикселях. Важный момент, как вы зададите настройки карты так они и будут отображаться на сайте. Можете отредактировать в ручную мышкой, колесиком можно приблизить и уменьшить размер, по желанию можете поставить галочку растянуть по ширине. После всех настроек нажмите на кнопку «получить код карты».

Далее вам необходимо скопировать полученный код и вставить его на сайт с помощью elementor, виджет html код.

Как в Elementor добавить Яндекс карту
Смотря какой у вас дизайн. И какая вам нужна карта. Выбирайте размеры или по всей ширине экрана.

Пример как будет выглядеть на сайте яндекс карта для elementor

Как в Elementor добавить Яндекс карту
Пример 1
Как в Elementor добавить Яндекс карту
Пример 2

Как вставить код яндекс карт на сайт с помощью elementor

Зайдите на нужную вам страницу сайта куда необходимо внедрить карту (обычно это страница контакты или подвал), добавьте новую секцию перетащите в нее виджет «Html-код». Далее вставьте ранее скопированный код  и нажмите кнопку обновить.

Как в Elementor добавить Яндекс карту
Можно использовать не только html вставка но и другой виджет например текст(там надо переключится в режим исходного кода).

Поздравляю! После всего проделанного надо сохранить страницу которую редактировали. Ваша карта готова.

UPD

Еще есть вот такой замечательный плагин Elementor Yandex Maps. Только этот способ более сложный, надо изучать инструменты разработчика и получить ключ API. Если интересно можете разобраться.

Примечание https://workruseo.ru/


Статья
На связи Павел Гречко \ Head of SEO. SEO-продвижение сайтов B2B, B2C компаний в Яндекс и Google. По вопросам сотрудничества пишите в Телеграмм: https://t.me/GrechkoPV

Привет! Я Паша из Всеволожска.
Больше 15 лет занимаюсь SEO-продвижением.

Делаю SEO для среднего и крупного бизнеса. Метбиз, Русма, Домотехника, Дар, ПневмоАльянс уже в деле!

По вопросам сотрудничества пишите в Телеграмм: https://t.me/GrechkoPV

PopUP