Нужна почта на Яндексе (vahro@yandex-dot-ru)
Делаем карту в конструкторе https://yandex.ru/map-constructor и вставляем код на страницу. Для того чтобы получить код нажимаем желтую кнопку «Сохранить и продолжить» и на следующем экране «Получить код карты». JavaScript код копируем и вставляем как блок html
<script type="text/javascript" charset="utf-8" async="" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3A520c60eacb2f92c3df5857cfbc4c5b7bfcfb59ae4375af6fd58be9d6613214cf&width=100%25&height=400&lang=ru_RU&scroll=true"></script>JavaScript оборачиваем в <div>. Это дает возможность добавить классы.
В редакторе кода WordPress будет выглядеть так
<!-- wp:html -->
<div style="max-width: 650px; width:100%" class="alignleft">
<script type="text/javascript" charset="utf-8" async="" src="https://api-maps.yandex.ru/services/constructor/1.0/js/?um=constructor%3A520c60eacb2f92c3df5857cfbc4c5b7bfcfb59ae4375af6fd58be9d6613214cf&width=100%25&height=400&lang=ru_RU&scroll=false"></script>
</div>
<!-- /wp:html -->
По умолчанию JavaScript код содержит scroll=true — это значит карта будет менять размер при прокрутке колесиком мыши — очень раздражает когда курсор при прокрутке попадает в область карты и вместо движения страницы меняется размер карты. Отменяем параметр, устанавливая scroll=false
Из самого скрипта ширину карты убираем (width=650&) — ширина блока будет определена в div style=’max-width: 650px; width:100%’. Будем надеяться таким образом добавить адаптивности для разных типов экранов в том числе планшетов и телефонов.
За обтекание текста отвечает class=′alignleft′, который надо разместить в файле style.css темы — .alignleft { align: left;}
И чтобы два раза не вставать. Если нужно в пояснениях к карте указать координаты навигатора, идем в Яндекс-карты, на желаемой точке нажимаем правую клавишу мыши, во всплывающем окне выбираем «Что здесь» и в сайдбаре в левой части экрана получаем описание точки и в том числе координаты.
Координаты этой точки 55.990701, 37.215293 – центр Зеленограда