Friweb 4.0

Google-Karte einfügen

5. Juli 2023

Hier ist die Vorgehensweise, um eine interaktive Google-Karte in eine Friweb-Site einzufügen :
 

Erstellen der Karte
  1. Suchen Sie auf der Website von Google Maps nach der Adresse, die auf der Karte erscheinen soll.
  2. Ändern Sie die Darstellung der Karte, wie sie auf der Website erscheinen soll (Zoom, Ausschnitt, Luftbild, etc.).
  3. Klicken Sie auf die Schaltfläche „Teilen“, die sich in der linken Leiste befindet.
  4. Klicken Sie auf die Register „Karten einbetten“.
  5. Klicken Sie auf „HTML kopieren“, um den Code in die Zwischenablage zu kopieren.
     
Einsetzen der Karte
  1. Auf der Friweb-Seite einen Block vom Typ „Individuelles HTML“ einfügen
  2. Fügen Sie den Inhalt der Zwischenablage in das Feld „Schreibe etwas in HTML…“ ein.
     
Anpassen der Kartengröße

Um die Abmessungen der Karte auf der Seite anzupassen, müssen Sie die Werte nach den Optionen „width“ (Breite) und „height“ (Höhe) in dem Code ändern, der soeben in das Feld eingefügt wurde.

Standardmäßig sind die Werte in Pixel angegeben, aber es ist durchaus möglich, einen Prozentsatz anzugeben, indem Sie dem Wert das Zeichen % folgen lassen. Dies kann praktisch sein, wenn die Karte über die gesamte Breite der Website angezeigt werden soll (siehe Beispiel unten).

Beispiel

Durch Einfügen des folgenden Codes (mit den Änderungen in Fettdruck) :

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d4584.077617427084!2d7.147411212993407!3d46.79952844323854!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x478e69373caa6eb1%3A0x4134e54b99a5cc5a!2sCentre%20Fritic!5e1!3m2!1sfr!2sch!4v1688549259763!5m2!1sde!2sch" width="100%" height="400" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>


Es ergibt sich folgendes Ergebnis: