Kartenausschnitt von Googlemaps integrieren

Transkript

1 Kartenausschnitt von Googlemaps integrieren Sie können auf jeder eigenen Webseite eine Karte von Googlemaps einbinden. Gehen Sie dazu wie folgt vor: Schritt 1 Googlemaps öffnen, Kartenausschnitt wählen Öffnen Sie unter den Kartendienst von Google. Wählen Sie nun den gewünschten Kartenausschnitt durch manuelles zoomen oder Eingabe einer Adresse. Unten links unter EARTH wechseln Sie zwischen der normalen Kartenansicht zur Satellitenaufnahme. Schritt 2 Code generieren für Verlinkung bzw. einbetten des Kartenausschnitts Sobald der Ausschnitt passend ist, klicken Sie oben links das Menu-Symbol und rufen bei der eingeblendeten Auswahl auf dem Menu KARTE TEILEN ODER EINBETTEN. Seite 1 von 6

2 Schritt 3 Code in die Zwischenablage kopieren Es öffnet sich über der Karte ein neues Fenster mit zwei Reitern. Jetzt haben Sie zwei Varianten, damit Ihre Besucher die Karte ansehen können: Seite 2 von 6

3 VARIANTE 1: Karte über einen Link verknüpfen Sofern Sie nur einen Link zur Karte und keinen eigentlichen Kartenausschnitt innerhalb der Webseite wünschen, dann kopieren Sie nur den Link unter dem Reiter LINK TEILEN. Damit der Link kürzer wird, können Sie noch die Checkbox Kurz-URL aktivieren. Sie integrieren dann den Link unter MENU UND SEITEN auf der entsprechenden Webseite durch Markieren einer Textstelle und Klick auf das KETTENSYMBOL auf dem Menu des Editors. Es öffnet sich ein neues PopUp mit der Bezeichnung LINK. Kopieren Sie nun den Link in das Eingabefeld URL. Achten Sie darauf, dass Sie nun zusätzlich noch die Einstellung des Aufrufs auswählen. Damit die Besucher ein neues Fenster geöffnet erhalten und Ihre Webseite nicht verlassen, wählen Sie auf dem zweiten Reiter ZIELSEITE die Einstellung NEUES FENSTER (_BLANK). Seite 3 von 6

4 VARIANTE 2: Kartenausschnitt sichtbar in Webseite integrieren Zur sichtbaren Integration des Kartenausschnittes in die Webseite klicken Sie den zweiten Reiter KARTE EINBETTEN. Sie kopieren den Code, welcher mit <frame beginnt in die Zwischenablage (Tastenbefehl CTRL + C). Seite 4 von 6

5 Schritt 4 Code in die Webseite einbinden Melden Sie sich nun bei ICHWÜNSCHE.COM an und öffnen Sie die Webseite MENU UND SEITEN. Auf dem Menu rufen Sie nun durch Klicken auf das BLEISTIFT-SYMBOL die entsprechende Webseite auf, in welche die Karte integriert werden soll. Auf dem Editor-Menu klicken Sie nun oben links auf QUELLCODE. Suchen Sie nun im Quellcode nach dem PLATZHALTERTEXT, der je nach Vorlage ungefähr wie folgt ausschaut: Sofern Sie die Karte an einer anderen Stelle integrieren möchten, merken Sie sich auf der Normalansicht eine Textstelle, welche sich vor der Karte befinden soll, damit Sie die gewünschte Stelle im Quellcode besser finden. Markieren Sie nun den ganzen Abschnitt wie oben gezeigt und löschen diesen. An der gleichen Stelle kopieren Sie nun Ihr Quellcode von Googlemaps hinein (Tastenbefehl CTRL + V). Seite 5 von 6

6 Schritt 5 Fensterausschnitt anpassen Damit nun der Kartenausschnitt die korrekte Grösse aufweist und optimal in das Design integriert wird, müssen Sie nun nur noch die Grössenangaben anpassen. Die Werte width= xxx und height= xxx müssen nun angepasst werden. Ersetzen Sie die Werte wie folgt: width= 100% height= 400 Wichtig! Prozentzeichen nicht vergessen! dieser Wert kann je nach gewünschter Höhe angepasst werden Die Anführungsstriche vor und nach dem Wert dürfen NICHT entfernt werden! Sofern der Wert bei width nicht 100% beträgt, kann die Karte bei verschiedenen Geräten nicht skalieren und passt sich nicht mehr an den korrekten Ausschnitt an. Schritt 6 Webseite speichern Speichern Sie nun die Webseite ab. Die Karte sollte nun bei der Webseitenansicht korrekt integriert sein und die Karte im Ausschnitt wird geladen. Wichtig: Im Bearbeitungsmodus wird die Karte nicht geladen! Es wird nur der Rahmen dargestellt. Seite 6 von 6