hier jetzt mal ein beitrag zu google karte, also maps, und wie ich diese auf der webseite darstellen kann.
da javascript fuer die meisten wordpress benutzerrollen, ausser dem admin, aus sicherheitsgruenden nicht erlaubt ist, muss das einbinden der google map durch shortcodes geloest werden.
shortcodes werden immer in eckigen klammern dargestellt und haben immer einen namen und man kann noch weitere parameter senden, wie z.b. breite oder hoehe oder was auch immer benoetigt wird. der google map shortcode sieht also folgendermassen aus:
[google-map src="meine-source-quelle-fuer-die-karte" width="meine-breite" height="meine-hoehe"]
das erste wort nach der eckigen klammer, ‚google-map‘, ist also der name des shortcodes und ich kann 3 parameter hinzufuegen. ’src‘ ist abkuerzung fuer englisch ’source‘, also quelle der karte, welche wir darstellen wollen.
‚width‘, also breite und ‚height‘, also hoehe sind optional. standard breite / hoehe sind 640 / 480 pixel. will man also eine breite / hoehe von 480 / 360, dann einfach parameter width=“480″ und height=“360″ verwenden.
des wichtigste aber ist die src / source, also quelle der google map. und die bekommen wir natuerlich von google maps. also erstmal hier auf google maps klicken und dann kann ich oben links nach meiner karte suchen. ich suche jetzt hier einfach mal nach ‚webagentur wiesentheid‘
nachdem ich auf suchen ge-klicked habe, sehe ich die karte und rechts unten gibts diese zahnrad grafik, und nach klick da drauf bekomme ich die option ‚karte teilen oder einbetten‘
nach dem klicken kommt diese pop-up und uns interessiert die option ‚karte einbetten‘
klickt man da drauf, dann kommt des und uns interessiert oben der code, welcher mit <iframe anfaengt, ich hab des mal rot hinterlegt
den code brauchen wir, und von daher kopieren wir den code erstmal via rechts-klick und kopieren
mach mir einen editor auf und kopiere mir den ganze code kram erstmal da rein
was dann so aussieht
und jetzt wirds wieder ein klein bissl technisch, denn wir muessen hier jetzt haendisch die richtigen daten rauskopieren, was aber echt auch net schwierig ist.
wir muessen uns hier jetzt die daten fuer den ’src‘ parameter rauskopieren. parameter sind echt nix schlimmes. z.b. gibts den width parameter, also width=“600″ oder den height parameter height=“450″
es gibt also den parameter namen, dann das gleich-zeichen und danach in den doppelten anfuehrungszeichen stehen die werte des parameters. und wir brauchen den wert fuer den parmater src, also quelle der karte, welche wir darstellen wollen. hier nun mal mit gruen hinterlegt. die doppelten anfuehrungszeichen brauchen wir NICHT!
ergibt also dann folgenden quellcode / source (src) fuer die karte
src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2575.6097669854626!2d10.342072!3d49.79340299999999!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47a265daca927287%3A0x1d415bf60b8a3a36!2sWebagentur+Wiesentheid!5e0!3m2!1sde!2sde!4v1432024130532"
und den ganzen code-kram fuegen wir jetzt in den google-maps shortcode ein, was dann so aussieht
[google-map src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2575.6097669854626!2d10.342072!3d49.79340299999999!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47a265daca927287%3A0x1d415bf60b8a3a36!2sWebagentur+Wiesentheid!5e0!3m2!1sde!2sde!4v1432024130532"]
und folgendes ergebniss erzielt. die darstellung der google maps karte fuer die webagentur wiesentheid – voila 😉
will ich die karte jetzt in einer anderen groesse haben, dann kann ich die parameter fuer breite und hoehe mitsenden. standard breite / hoehe ist 640 / 480
hier jetzt z.b. 400 / 300
[google-map width="400" height="300" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d2575.6097669854626!2d10.342072!3d49.79340299999999!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47a265daca927287%3A0x1d415bf60b8a3a36!2sWebagentur+Wiesentheid!5e0!3m2!1sde!2sde!4v1432024130532"]
was dann also so aussieht:
viel spass mit den google maps 😉