Jeden z czytelników mojego bloga poprosił mnie żebym dodał tutorial we wpisie jak dodać kod mapy google na bloga. Jeśli również masz jakiś problem i chciałbyś zobaczyć jego opis na moim blogu, zadaj mi pytanie tutaj, a chętnie ci odpowiem ;)Aby dodać mapę Google na blog/stronę, przejdź na stronę http://mapy.google.pl/ w polu wyszukiwania miejsce, które chcesz wyświetlać na swojej stronie, czy blogu. Kiedy już wszystko przygotowałeś, czas na przeniesienie kodu twojej mapy na stronę/bloga.
W tym celu kliknij w prawym górnym rogu mapy link i skopiuj zawartość jak poniżej.
Jeśli chcesz umieścić kod mapy na blogu WordPress, masz możliwość zrobić to na kilka sposobów.
1. Umieszczanie mapy Google na statycznej stronie w WordPress
- zaloguj się do panelu administracyjnego
- wybierz zakładkę Strony i kliknij Dodaj nową
- Teraz wybierz Źródło dokumentu lub strony w swoim edytorze i wklej tam swój kod:
- odznacz źródło dokumentu i wyrównaj swoją mapę. Dodaj tytuł swojej strony, np. „dojazd” i kliknij Opublikuj.
Możesz również zmieniać rozmiar w kodzie mapy Google ( width-szerokość oraz height-wysokość )
2. Umieszczanie mapy Google jako widżet na blogu
- Aby umieścić kod mapy Google w Widgetach na blogu wybierz z panelu administracyjnego WordPress Wygląd, a następnie Widgety.
- wybierz z dostępnych widget oznaczony jako Tekst (możesz wkleić tam dowolny tekst lub kod HTML) i przeciągnij go do swojego paska
- otwórz widżet Tekst, który umieściłeś w swoim pasku widżetów i wklej tam swój kod pobrany z Google maps.
- dopasuj szerokość i wysokość tak, aby zachowana była estetyka strony ( <iframe width=”425” height=”350„) edytuj tylko parametry podświetlone na czerwono tak, aby dopasować rozmiar mapy do szablonu strony.
Możesz również dodać google mapę do wpisu podobnie jak przy dodawaniu kodu mapy na stronę statyczną w WordPress.
Widzisz, że dodawanie mapy Google na blog nie jest wcale takie straszne, jak się wydaje. Czasami szablony oferują po bokach dodatkowe szerokie pola, gdzie można wklejać grafikę, więc możesz to wykorzystać i wkleić tam kod swojej mapy.
Jeśli masz jakieś pytania czy problem z dodawaniem map, napisz mi w komentarzach, a odpowiem ci na nie 😉
14 Responses
Twój sposób jest jasny i czytelny jednakże w tym przypadku przyjrzał bym się kilku wtyczkom które łatwo znaleźć w internecie. Ja korzystam z WP_GMaps2 i zawdzięczam jej oprócz pewnej automatyzacji pracy, wzrost zróżnicowania treści na blogu.
Aktualnie w sieci można znaleźć już setki wtyczek tego typu – i każda jest najlepsza 🙂 Tylko teraz którą wybrać? 🙂
Racja, wpis był publikowany stosunkowo dawno… 😉
Zanim wybiorę jakąś wtyczkę, wyszukuję 5 najlepszych (liczba ocen i gwiazdek, komentarze oraz ostatnia aktualizacja) i testuję je. Następnie wybieram tą, którą najłatwiej się konfiguruje i daje najlepszy efekt 😉
Jak znajdę trochę czasu, to przetestuję wtyczki do umieszczania mapy na blogu 😉
Pozdrawiam
Ja jade na tym patencie z mapami jezeli chce ja dodac do wpisu np. http://echomarketingu.wordpress.com/2012/04/25/jak-wstawic-mape-google-maps-do-wpisu-wordpress-bez-uzywania-wtyczek/
a jak wstawić to mape na stronie? w xhtml?
jak? odp. szybko please!
Musisz wstawić kod HTML ( kod
Witam.
Właśnie próbuje ugryźć temat mapek na swoim blogu i twój wpis bardzo mi pomógł. Ale mam jeszcze takie pytanie: jak mogę dodać link do opisu znacznika (w chmurce) w mapach Google by przeniósł potencjalnego czytelnika np. do wpisu na moim blogu?
Rewelacyjny blog. Skorzystałem już kilka razy. Zapraszam do siebie w wolnych chwilach.
Dodałam mapę na stronie http://rodhutnik.wordpress.com/, według wskazówek ale chciałabym zrobić obrys działek, jak to jest zrobione na stronie http://rodjaskolka.ovh.org/index.php?option=com_content&task=view&id=32&Itemid=16. Jak to zrobić? Czy jest to możliwe w wordpress.com? A jeszcze jedno w edytorze tekstu nie mam okienka : Źródło strony. Czy mogę jakoś to dodać?
Ciekawi mnie jak wyknac aby mapa była na całej szerokośc strony? Widziałem gdzies takie rzwiazanie na podstronie kontakt. Mapa dostosowywała się do rozdzielczości.
Wtedy mapa musiałaby być responsywna Wpisz w Google Responsive google maps – na pewno coś znajdziesz 😉
Pozdrawiam!
W miejscu, gdzie masz width ustawiasz na 100%, więc
width=”100%” a wysokość możesz pozostawić w pikselach.
Dla bardziej zaawansowanych polecam API. Można naprawdę fajne rzeczy z mapką zrobić na stronie.
Prosto i przejrzyście opisane , dziękuję za ten wpis, dzięki któremu udało mi się dodać moją stronę do google, Pozdrawiam Juchcik