360° Integration
Mit komoot kannst du ganz einfach Touren und Karten in deine Webseite einbinden. Wie bei einem YouTube Video erfolgt die einbindung über einen sogenannten
iFrame
.
Debei kannst du zwischen einer einzelnen Tour mit Karte oder einer Übersichtskarte aller deiner Touren wählen.
Touren auf komoot anlegen
Zunächst brauchst du natürlich erst mal eine oder mehrere Touren in "Mein komoot". Dafür hast du drei Möglichkeiten:
- Eine Tour mit komoot planen – Nutze den Routenplaner und suche zunächst den Startpunkt, wähle die Sportart und setze 1 - 2 Wegpunkte mit der rechten Maustaste. Der Button "Los geht's" liefert dir Tourenvorschläge, die du weiter anpassen kannst. Dazu einfach "an der Linie ziehen" oder weitere Wegpunkte mit der rechten Maustaste hinzufügen. Jetzt nur noch speichern und schon ist sie bereit zum Einbinden auf deiner Seite.
- Eine Tour mit der komoot App aufzeichnen – Genauso einfach und noch besser für deine Kondition. komoot App laden, raus aus dem Haus und die Aufzeichnung starten. Das beste daran: Du kannst direkt mit der App Fotos machen.
- Eine Tour als GPX-Tour hochladen – Wenn du eine Tour von einem GPS-Gerät oder aus einem GPS-Programm hochladen willst, kannst du das direkt unter Mein komoot. Einfach in deiner Tourliste "GPX-Tour hochladen" klicken.
Du kannst deiner Tour jetzt noch weitere Informationen und Fotos hinzufügen.
Deine Tour als Karte einbinden
Unter Mein komoot findest du die Funtkion "Tour empfehlen". Klicke dort auf "Link". Den HTML-Code kannst du, oder der Betreuer deiner Webseite, einfach einbinden. Mit den Attributen
width
und
heigth
kannst du dabei die Größe anpassen:
<iframe width="650" height="450" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.komoot.de/tour/TOURNAME/ID?embed">
</iframe>
Eine Übersichtskarte einbinden:
Du kannst auch alle deine Touren bei komoot als Übersichtskarte in deine Webseite einbinden. Dazu kannst du einfach als Quelle (
src=""
) für das iFrame den Link zu deiner Seite bei komoot nehmen und ein
?embed
anhängen:
<iframe width="650" height="450" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.komoot.de/user/BENUTZERNAME?embed"></iframe>
Ein Menü erstellen
Du kannst auch eine Karte nutzen, um mehrere Touren über ein Menü anzuzeigen.
Dazu musst du lediglich dem iFrame mit der Karte einen Namen geben - z.B.
name="komoot_karte"
. Dann kannst du ein Menü mit Links zu verschiedenen Touren erstellen. Bei den Links musst du jetzt nur noch die Karte als Ziel angeben - also
target=komoot_karte
.
HTML-Code für das Beispielmenü:
<ul>
<li><a href="http://www.komoot.de/tour/TOUR-1/ID?embed"
target="komoot_karte">Tour 1</a></li>
<li><a href="http://www.komoot.de/tour/TOUR-2/ID?embed"
target="komoot_karte">Tour 2</a></li>
<li><a href="http://www.komoot.de/tour/TOUR-3/ID?embed"
target="komoot_karte">Tour 3</a></li>
</ul>
HTML-Code für die Karte:
<iframe name="komoot_karte"" width="650" height="450" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.komoot.de/user/BENUTZERNAME?embed"></iframe>
Weitere Möglichkeiten
Damit du deine Touren noch einfacher in deinen Blog einbinden kannst, gibt es das Plugin komoot for WordPress. Damit kannst du die Links zu deinen Touren direkt in Posts und Seiten einbininden und sie werden automatisch als Karte angezeigt.
Die Karten lassen sich übrigens auch als "Reiter" auf einer Facebook Seite einbinden. (Leider nicht auf einem Facebook Profil).
Melde dich, wenn du weitere Fragen dazu hast!
Nutzungsbedingungen
Die Anerkennung der komoot Nutzungsbedingungen und Allgemeinen Geschäftsbedingungen (mehr) sowie der Nutzungsbedingungen für Lösungen (mehr) ist Voraussetzung für die Nutzung der hier beschriebenen Lösung. Mit Nutzung der komoot Lösungen erkennst der Nutzer die vorstehenden Bedingungen an.