Share This

Najprostszy sposób umieszczenie mapy google na stronie internetowej to iframe. Pobieramy kod do wstawienia ze maps.google.pl i wszystko działa. Oczywiście firma musi być widoczna w mapach google.
Chyba nawet w tym momencie powinno to działać?

Ostatnio wykonując stronę dla klienta jak zwykle dokonywałem poprawek w projekcie. W projekcie na każdej zakładce pojawiała się mapa google umieszczona w iframe. Niestety podczas scrollowania strony w dół po dotarciu do mapy google zamiast przesunięcia strony w dół do kolejnych sekcji następowało zoomowanie mapy. To nie podobało się klientowi. Rozwiązaniem tego problemu było umieszczenie mapy w specjalnym module.
Ponieważ projekt strony www Puławy powstawał na Joomla i frameworku Gantry 5 zdecydowałem że użyję cząstki/particel autorstwa Inspire Theme. Cząstka jest dostępna po wykupieniu członkostwa.

Niestety po zainstalowaniu cząstki i jej skonfigurowaniu pojawia się komunikat

"Ups... Coś poszło nie tak.
Ta strona nie wczytała Map Google prawidłowo. Szczegóły techniczne znajdziesz w konsoli JavaScript."



Klucz Google Maps API - strony www Lublin na CMS Joomla

W pierwszej chwili pomyślałem że to nietypowe ustawienia hostingu, na moim serwerze na nazwa.pl przecież działało. Tyle że w wpinaczu - iframe joomla.
Okazało się jednak że problem leży gdzie indziej. Jeszcze przed wakacjami 2016 google postanowiło zmienić zasady tej usługi. To co do tej pory było bezpłatne powoli staje się usługą komercyjną. Całe szczęście dla małych firm których strony www Lublin nie są odwiedzane zbyt często usługa pozostaje bezpłatna. Trzeba się jednak zarejestrować i pobrać bezpłatny klucz Google Maps API. Procedura jest raczej prosta i w kilkanaście minut można wygenerować własny klucz API dla Map Google,  dzięki temu jeśli wystarczy nam 25 000 żądań API dziennie nie będzie trzeba płacić za tę usługę. Do czasu aż google obniży ten limit :)

Wszystkie usługi google skupiają sie wokół adresu mailowego na gmail.com. Tworząc projekty strony internetowe Lublin na joomla proszę więc moich klientów żeby założyli sobie takiego maila do obsługi Google Plus, google Analytics, google Adsense czy Search Console. Dodatkowy mail na gmail jest wskazany nawet jeśli klient już ma tam konto bo czuł bym się niezręcznie mając dostęp do prywatnych maili klienta, a po za tym lepiej żeby komunikaty techniczne nie zaginęły w natłoku  prywatnej korespondencji.

Jak wygenerować bezpłatny klucz Google Maps API dla naszej strony www Lublin.

Uwaga - usługi google, ich funkcjonalności i wygląd zmieniają się dość często więc za jakiś czas ten tutorial może stracić na aktualności.

Wcześniej założyłem testowy projekt i w żaden sposób nie mogę go usunąć mimo że taka opcja jest widoczna.

Po założeniu maila na gmail.com

1. Logujemy się do
https://console.developers.google.com

2. Z górnego menu obok logo Google APIs wybieramy "Project" a następnie "Utwórz projekt"

Klucz Google Maps API - strony www Lublin na CMS Joomla


3. Nadajemy naszemu projektowi nazwę. Poniżej jest identyfikator projektu który możemy edytować. Klikam button "UTWÓRZ"

Klucz Google Maps API - strony www Lublin na CMS Joomla



4. Automatycznie przenosi nas do zakładki "Biblioteka"

Klucz Google Maps API - strony www Lublin na CMS Joomla



5.W sekcji menu „Interfejsy Google Maps API” wchodzimy w  

Google Maps JavaScript API
Google Static Maps API

Jeśli niewidoczne klikamy "Więcej"

{josociallocker}

6. W każdej z tych pozycji klikamy button "Włącz"

Klucz Google Maps API - strony www Lublin na CMS Joomla



7. Panel zmienia się wtedy tak. Teoretycznie powinno dać się to wyłączyć ale button "wyłącz" zwyczajnie nie działa.

Klucz Google Maps API - strony www Lublin na CMS Joomla



8. Po włączeniu wszystkich interfejsów które uznaliśmy za przydatne, przechodzimy do zakładki "Dane logowania" - menu z lewej strony ostatnia pozycja. W tym panelu klikam button "Utwórz dane logowania"

Klucz Google Maps API - strony www Lublin na CMS Joomla



9.Wybieram opcję "klucz API" i klikam w nią

Klucz Google Maps API - strony www Lublin na CMS Joomla



10. Klucz API został wygenerowany.

Klucz Google Maps API - strony www Lublin na CMS Joomla



11. Ikonka kosza nie działa więc nie mogę usunąć tego klucza. Natomiast po kliknięciu w ikonkę "pisaka" przechodzimy do panelu "Klucz API"

Klucz Google Maps API - strony www Lublin na CMS Joomla

 

 

{/josociallocker}

Przydało się? - Udostępnij

Blog - popularne

Specified key was too long; max key length is 767 bytes - błąd podczas przywracania strony za...

Klient poprosił mnie o zwiększenie wersji PHP do najnowszej wersj PHP 7.2. Przy stronach firmowych najczęściej nie wykonuję takich operacji z automatu tylko staram się na początek sprawdzić czy jest...
Czytaj dalej

Akeeba Kickstart - czyli jak przywrócić stronę internetową Joomla 3 z kopii zapasowej Akeeba Backup

Przenosimy stronę na CMS joomla na inny serwer. Mając wykonaną za pomocą Akeeba Backup kopię strony www możemy ją przenieść w krótkim czasie na dowolny serwer. Czas wysyłania na serwer rozpakowanych...
Czytaj dalej

Jak zrobić banner slideshow w joomla 3 - dodatek Roksprocket dla strony www na joomla

Roksprocket dla Joomla czyli jak zrobić banner dla naszej strony internetowej na joomla. Roksprocket do moduł którego wersja występuje także dla wordpressa. Można za jego pomocą wykonać nie tylko...
Czytaj dalej

Jak dodać firmę do Google Maps

Tworząc firmową stronę internetową prawie zawsze umieszczamy na niej mapę z lokalizacją firmy. Czasy statycznych map graficznych minęły dawno temu. Teraz najczęściej szukamy firm na google które ma...
Czytaj dalej

Jak dodać film z youtube stronę www na joomla - dodatek AllVideos od Joomla Works

Niezbyt często korzystam w wykonywanych stronach www z możliwości osadzania w nich wideo. Jeśli klienci mają przygotowane materiały wideo warto je wykorzystać nie tylko z powodu lepszego zapoznania...
Czytaj dalej

Jak wykonać przekierowanie DNS domeny zarejestrowanej na home.pl na serwer nazwa.pl - na którym...

Przekierowanie DNS wykonujemy kiedy domenę zarejestrowaliśmy w jednej firmie, a hosting dla naszej strony internetowej wykupiliśmy w innej. Dzisiaj pokażę jak przekierować domenę zarejestrowaną na...
Czytaj dalej

Przezroczystość w plikach PNG - jak zapisać plik z PNG z przezroczystością w Adobe Photoshop dla...

Format .png to drugi w kolejności po .jpg format plików graficznych wykorzystywany w czasie tworzenia stron internetowych. Oczywiście większość użytkowników internetu najbardziej kojarzy .jpg bo w...
Czytaj dalej

WordPress - jak wykonać kopię zapasową strony www na WordPress za pomocą Akeeba Backup

WordPress podobno nie sprawia problemów, ale dmuchając na zimne - kopię strony www należy wykonać jeśli zależy nam na bezpieczeństwie naszych danych. Akeeba Backup to narzędzie które powstało jako...
Czytaj dalej

Akeeba Backup - jak wykonać kopię strony www na CMS Joomla 3

Akeeba Backup pozwala na tworzenie kopii na wszystkich wersjach joomla - tu w wersji dla Joomla 3 Mając stronę internetową utrzymywaną na dobrym hostingu nie musimy martwić się o wykonywanie kopii...
Czytaj dalej