[contact-form-7 id="24085" title="Feedback RU"]

Новые шаблоны

Shopify. Как решить проблему отсутствия Google Карты

Добрый день! Из этого видео-туториала Вы узнаете, как решить проблему отсутствия Google Карты в шаблонах Shopify.

Google Карта может исчезнуть в вашем интернет-магазине.

shopify_fix_google_map_missing_issue_1

Этот случается из-за изменений, которые Google недавно внес в свою политику – теперь Вы должны добавить ваш личный ключ API в карту, для того чтобы он функционировала.

Давайте узнаем, как решить эту проблему.

Во первых, получите ваш личный ключ API.

  1. Перейдите на сайт https://developers.google.com/maps/documentation/javascript/get-api-key и создайте ваш ключ авторизации, нажав на кнопку «Получить ключ» (Get a Key):

    shopify_fix_google_map_missing_issue_2

  2. Выберите параметр «Создать проект» (Create a project) и нажмите на кнопку «Продолжить» (Continue):

    shopify_fix_google_map_missing_issue_3

  3. В открывшемся окне заполните обязательные поля и нажмите на кнопку «Создать» (Create):

    shopify_fix_google_map_missing_issue_4

  4. Сделав это, Вы получите созданный для Вас ключ:

    shopify_fix_google_map_missing_issue_5

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

Войдите в вашу админ панель Shopify.

  1. Перейдите на вкладку Интернет-магазин -> Шаблоны (Online Store -> Themes):

    shopify_fix_google_map_missing_issue_6

  2. Затем, нажмите на кнопку «…» справа вверху и выберите настройку «Редактировать HTML/CSS» (Edit HTML/CSS):

    shopify_fix_google_map_missing_issue_7

  3. В открывшемся окне нажмите на название файла widget-googlemap.liquid в папке Snippets, для того чтобы открыть файл для редактирования:

    shopify_fix_google_map_missing_issue_8

  4. Найдите следующий код на строке 3:

    <script src="//maps.googleapis.com/maps/api/js?v=3.exp"></script>
  5. Добавьте следующий фрагмент кода сразу после вопросительного знака (?):

    key=XXXXXXXXXXXXXXXXXX&

    Здесь XXXXXXXXXXXXXXXXXX – это ваш личный ключ API.

    Код должен выглядеть следующим образом:

    <script src="//maps.googleapis.com/maps/api/js?key=XXXXXXXXXXXXXXXXXX&v=3.exp"></script>
  6. После этого, нажмите на кнопку «Сохранить» (Save), для того чтобы применить изменения:

    shopify_fix_google_map_missing_issue_9

  7. Перейдите на фронтенд вашего сайта и обновите страницу для просмотра изменений.

  8. Как Вы можете видеть, карта теперь отображается:

    shopify_fix_google_map_missing_issue_10

Это конец туториала. Теперь Вы знаете, как решить проблему отсутствия Google Карты в вашем шаблоне Shopify.

Вы можете также ознакомиться с детальным видео-туториалом ниже:

Shopify. Как решить проблему отсутствия Google Карты