Question

Здравствуйте.

Подскажите, страница - КОНТАКТЫ

Используется модуль - Гугл карты

Вот такой код  :

<div class="map_full_width contact_page">
 <div id="google-map" class="map_model"></div>
 <ul class="map_locations">
 <li data-x="37.5765306" data-y="55.7063433" data-basic="/images/gmap_marker.png" data-active="/images/gmap_marker.png">
 <p> Позвоните нам <span>905 624-11-18</span></p>
 </li>
 </ul>
</div>

Не пойму, что и как мне поменять, какие пораметры своего местаположения ввести и где брать  X и Y своих координат.

Наш адрес г. Тула, ул. Демидовская плотина 41

Гугл карты дают мне код - <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d346.9361198159115!2d37.63411510526174!3d54.19957740651389!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x41343f7c85a87351%3A0x7b591212af6242f1!2z0YPQuy4g0JTQtdC80LjQtNC-0LLRgdC60LDRjyDQv9C70L7RgtC40L3QsCwgNDEsINCi0YPQu9CwLCDQotGD0LvRjNGB0LrQsNGPINC-0LHQuy4sINCg0L7RgdGB0LjRjywgMzAwMDAx!5e0!3m2!1sru!2sus!4v1498747286077" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

Но у меня не получается ввести его так, что бы осталось так же красиво и с моими данными.

Подскажите пожалуйста, можно что то сделать ?

Answer 1

Воспользуйтесь одним из конструкторов:

• https://support.google.com/maps/answer/3544418?hl=ru Конструктор Google карт
• http://api.yandex.ru/maps/tools/constructor/ Яндекс maps

или воспользуйтесь сервисом - здесь.

Comments

По этим картам я уже делал и получается совсем по другому.   Я бы хотел сделать именно так же , как и в шаблоне, только с моими данными, - это можно как то  сделать ? или только стандартно, как дает гугл?  Тогда я не пойму, зачем делать в шаблоне по другому, если нет возможности изменить все под свои данны ?

---

Роман Иванов,

Это делается на основе гугловского айпи, не просто встраиванием фрейма. Вот как у меня реализовано на стороннем сайте, где нужно чтобы карта отображалась, ставим код:

 <div id="google-map" class="google-map"></div>
 <script type='text/javascript' src='http://maps.googleapis.com/maps/api/js?key=AIzaSyCbAN76ZeY1YTCfMTnqAeRcwY_eLEd9AKQ'></script>
    <script type='text/javascript' src='/js/google-maps.min.js'></script>
    <script type='text/javascript' src='/js/map.js'></script>

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

Редактирование Google карты

Если Google карта не работает

Теперь для работы google-карты необходимо получить специальный API ключ.

Ключ можно получить вот тут https://developers.google.com/maps/documentation/javascript/ 
(вы должны быть авторизированы в аккаунте google). В шапке увидете кнопку "получить ключ", жмите её и потом все время далее. Код ключа будет примерно таким FIzaSyAKEed4agSh...6cQuLZw8J3jom03gw7Y

После этого зайдите в панель управления своим сайтом - управление дизайном - шаблоны главной и шаблон контактов, внизу найдите вот такую строку

<script type='text/javascript' src='http://maps.googleapis.com/maps/api/js'></script>

Замените этот код на код с полученным ключом (YOUR_API_KEY - вместо этой надписи вбейте ключ)

<script type='text/javascript' src='http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY'></script>

Чтобы на карте маркер отображался в нужных координатах откройте файл map.js и найдите там такой код

     google.maps.LatLng(59.95870772422682, 30.3100860491395)

Замените значения координат

Чтобы узнать координаты для своего адреса - воспользуйтесь сервисом 3planeta.com.

Введите свой адрес, кликните по карте в нужном месте. Координаты зафиксируются в правом верхнем поле «ДГ - десятичные градусы». 
Скопируйте их и вставьте вместо 59.95870772422682, 30.3100860491395

---

Yuri_Geruk,

Спасибо, боюсь у меня не получится)))))))

Answer 2

Вот ваши координаты

<div class="map_full_width contact_page">
 <div id="google-map" class="map_model"></div>
 <ul class="map_locations">
 <li data-x="54.199592" data-y="37.634276" data-basic="/images/gmap_marker.png" data-active="/images/gmap_marker.png">
 <p> Позвоните нам <span>905 624-11-18</span></p>
 </li>
 </ul>
</div>