Яндекс-карты или Google maps
Прежде всего хочу рассказать в чём отличия между нашими яндкес-картами и google maps.
Яндекс-карты нашему глазу привычнее, но у них есть два больших недостатка, вытекающих из того, что их нужно вставлять скриптом (через тег <script>):
- Первый недостаток: загрузка дополнительного скрипта – это увеличение времени загрузки страницы (обычно Google PageSpeed Insights на это ругается).
- Второй недостаток: во время подгрузки страницы по технологии Ajax, которая используется во всплывающих окнах темы Формула Успеха, и на страницах темы Стильный Сайт теги <script> "обрезаются", т.е. просто не загружаются и карту не видно.
Карты Google встраиваются через тег <iframe>, который подгружает скрипт карты асинхронно (т.е. у него нет первого недостатка яндекс-карт). Также данный тег не "обрезается" во время подгрузки информации по технологии Ajax (т.е. второй недостаток яндекса тоже отсутствует).
Теперь когда вы знаете о различиях двух картографических сервисов, можете принять взвешенное решение и выбрать тот сервис карт который подходит для ваших целей.
Встраивание Яндекс-карт
Идём по адресу maps.yandex.ru.
В поле поиска адреса вводим необходимое метоположение, и жмём искать.
Затем жмём на жёлтую кнопку "Получить код без авторизации". Появится код. Копируем его.
Идём в приложение сайт. Открываем страницу, в которую хотим вставить карту, и переводим режим редактора в HTML.
Вставляем полученный код.
Только нужно параметр width изменить с 330 на 100% и после скрипта добавть тег BR. Смотрим на скрин.
Встраивание Google Maps
Открываете сайт Google Maps.
Вводите необходимый адрес и нажимаете на "поделиться".
В появившемся окне выбираете вкладку код, выбираете размер (первая цифра не важна, вторая – это высота блока с картой) и копируете код из окошка.
Затем открываете редактор страницы переводите его в режим HTML. Вставляете скопированный код и меняете цифру в атрибуте width на 100%.
0 комментариев