Prezentowaliśmy już jak osadzać ten element w dziale kontakt. Za pomocą modułu naszego autorstwa:
https://pskrk.com/prestashop-1-5-darmowy-modul-google-maps-dla-prestashop-na-stronie-kontakt/
Jednak po niedawnych zmianach w usłudze Google Map ten sposób może niedziałać poprzez błąd:
REQUEST_DENIED - API keys with referer restrictions cannot be used with this API.
Najlepszym sposobem aby to obejść będzie wstawienie mapy Google, która jest w PrestaShop wbudowana.
1. Prawidłowe skonfigurowanie zakładki nasze sklepy.
Warunkiem koniecznym jest prawidłowe skonfigurowanie pokazywania się mapy w tej zakładce. Zostało to wnikliwie przez nas opisane w tym artykule:
https://pskrk.com/jak-prawidlowo-skonfigurowac-zakladke-nasze-sklepy-w-presta-shop/
Efektem działań powinna być mapka wyświetlana pod adresem:
http://www.adres-sklepu.pl/index.php?controller=stores
2. Przeniesienie kodu.
Dalsza konfiguracja polega na prawidłowym użyciu kodu z zakładki „Nasze sklepy” w zakładce „Kontakt”
Otwórz plik:
controllers/front/ContactController.php
W funkcji:
public function initContent()
Zamień kod:
$this->context->smarty->assign(array( 'contacts' => Contact::getContacts($this->context->language->id), 'message' => html_entity_decode(Tools::getValue('message')), 'contactKey' => $contactKey ));
Na:
$this->context->smarty->assign(array( 'contacts' => Contact::getContacts($this->context->language->id), 'message' => html_entity_decode(Tools::getValue('message')), 'contactKey' => $contactKey, 'mediumSize' => Image::getSize(ImageType::getFormatedName('medium')), 'defaultLat' => (float)Configuration::get('PS_STORES_CENTER_LAT'), 'defaultLong' => (float)Configuration::get('PS_STORES_CENTER_LONG'), ));
(czyli dopisz 3 ostatnie klucze w tej tablicy: mediumSize, defaultLat, defaultLong)
UWAGA! Nie zapomnij postawić przecinka po ostatniej wartości klucza czyli w w/w przypadku po kodzie ’contactKey’ => $contactKey
W PHP przecinki oddzielają kolejne elementy tablicy i tak samo jest w tym przypadku.
Do funkcji:
public function setMedia()
(w tym samym pliku) dopisz poniższy kod:
$api_key = (Configuration::get('PS_API_KEY')) ? 'key=' . Configuration::get('PS_API_KEY') . '&' : ''; $default_country = new Country((int)Tools::getCountry()); $this->addJS('http'.((Configuration::get('PS_SSL_ENABLED') && Configuration::get('PS_SSL_ENABLED_EVERYWHERE')) ? 's' : '').'://maps.google.com/maps/api/js?'.$api_key.'region='.substr($default_country->iso_code, 0, 2));
Otwórz plik:
themes/{TWÓJ-SZABLON}/contact-form.tpl
Zamień kod:
</fieldset> </form>
Na:
</fieldset> <div id="map" style="height: 400px; width: 100%"></div> </form>
Lub po prostu umieść w dowolnym miejscu, gdzie chcesz DIV:
<div id="map" style="height: 400px; width: 100%"></div>
Jest to kontener trzymający mapę Google.
Następnie na końcu tego samego pliku umieść kod:
{addJsDef defaultLat=$defaultLat} {addJsDef defaultLong=$defaultLong} {literal} <script type="text/javascript"> map = new google.maps.Map(document.getElementById('map'), { center: new google.maps.LatLng(defaultLat, defaultLong), zoom: 16, mapTypeId: 'roadmap', mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU} }); var marker = new google.maps.Marker({ position: new google.maps.LatLng(defaultLat, defaultLong), map: map }); </script> {/literal}
Gotowe!
Uwaga, aby zmiany były widoczne konieczne jest przebudowanie cache. Można to zrobić poprzez usunięcie folderu /cache lub wymuszenie kompilacji. Więcej informacji na ten temat w artykule https://pskrk.com/prestashop-1-6-sposoby-na-przyspieszenie-sklepu/
[…] Z racji na zmiany w API Google Maps poniższy moduł może nie działać. Sprawdź nowy sposób na osadzenie mapki w dziale kontakt w sklepie PrestaShop za pomocą kodu ze strony „Nasze Sklepy” (która jest wbudowana w silnik […]