Umsetzung Navigation Routing in Webseite einbinden

  • Hallo Leute,

    ich möchte auf unserer Vereinswebseite folgendes Projekt umsetzen. Wir betreiben einen Museumsbunker, im Umfeld befinden sich weitere Bunkerruinen. Nun würde ich gerne eine Unterseite erstellen, wo die einzelnen Ruinen vorgestellt und erklärt werden. Die Besucher sollen am Museumsbunker einen QR-Code oder Ähnliches scannen können und gelangen dann auf die Unterseite der Ruinen. Auf dieser soll sich auch eine Möglichkeit der Navigation befinden und da stecke ich mit der Umsetzung fest.


    Wie kann ich eine Navigation einbinden, ohne die Besucher von der Webseite wegzuleiten oder mindestens wieder zurückzuleiten?


    Ein Gedanke war auch, die Navigation am Museumsbunker zu starten und zum ersten Ziel zu leiten. Dort angelangt vielleicht wieder einen QR-Code mit Informationen auf der Webseite.


    Hat jemand vielleicht schon mal etwas Ähnliches umgesetzt? Ich hoffe, die Erklärung war einigermaßen verständlich.


    Vielen Dank

  • Ganz banale Idee zur Umsetzung:

    Für jede Ruine eine Seite / Beitrag erstellen und diese einer Kategorie erstellen. Dann kannst Du für jeden Beitrag einen eigenen QR-Code erstellen, der jeweils auf den Beitrag verweist.

    Wenn Du das alles als Blog o.ä. darstellst, dann kannst Du die Beiträge auch in der Reihenfolge festlegen. Zusätzlich könntest Du ein Image-Map o.ä. erstellen, wenn Du dieses in eine Art Karte anzeigen lassen möchtest. Das kann auch in einem Modul auf jeder Seite eingebunden werden.

    Wenn man die Lösung hat, dann muss man nur noch das passende Problem finden.

  • Hallo Lukas, erst mal vielen Dank. Ja die Umsetzung mit den Beiträgen kam mir auch schon in den Sinn. Im Blog passt das dann natürlich noch viel besser. Image Map ist für mich neu, aber eine gute Idee, wobei mir dann immer noch die aktive Navigation fehlt. Kann ich eine Googlekarte einbinden, in der mir dann mein eigener Standort angezeigt wird?


    Grüße

  • Hier gibt es etwas Informationen zu Image-Maps und Alternativen.
    https://www.mediaevent.de/html/area-map.html

    Eine Karte von Google oder OpenStreetMap wäre auch möglich. Nur da müsstest Du schauen, ob man soweit rein zoomen kann, um das darstellen zu können. Ich war jetzt von kleinen Wanderwegen ausgegangen und da würde es schwierig werden. Für den eigenen Standort ist es etwas kniffliger. Es gibt Skripte, die dem User fragen, ob man den Standort abfragen darf und dann musst Du es der Karte mitteilen, wenn der Besucher diesem zustimmt.

    Wenn man die Lösung hat, dann muss man nur noch das passende Problem finden.

  • Hallo Astrid,

    vielen lieben Dank, das sieht wirklich schick aus. Werde es auf jeden Fall mal einbauen und testen. Habe gerade eine Google myPlace Karte eingebunden und bin schon relativ weit. Wenn ich fertig bin, teile ich das Ergebnis hier und setze den Beitrag auf erledigt.


    Grüße

  • So, ich bin jetzt relativ weit und die Karte bereits auf unserer Vereinsseite eingebunden. Jetzt sollen die einzelnen Punkte noch ihre Beschreibung bekommen und da stellt sich mir aber noch die Frage, wie ich am besten einen Link in die Beschreibung einfügen kann?

    Ich habe es so probiert <link>https://arbeitskreis-bunkerfor…and/wegpunkt-1-bunker-337</link>


    PS: die anpassbaren Icons sind auch klasse

  • Guten Morgen astrid,

    ich muss dich noch mal stören. Wir haben gestern im Verein die Karte getestet und sind die Route abgelaufen. Nun habe ich noch 2 Fragen zum Plugin.


    1. wäre noch, wie kann ich einen Link in die Beschreibung einfügen? Das ist mir bis heute nicht gelungen.

    2. ist es am iPhone nicht möglich, sich seinen eigenen Standort anzeigen zu lassen. Scheinbar hat der Nutzer dem Browser die Nutzung des Standorts verweigert. Könnte man das Hinweisschild "Geolocation error: User denied Geolocation." so anpassen, dass dem User angezeigt bekommt, wie er die Standortbestimmung wieder aktiviert?


    Grüße und Danke


  • Hast du bezüglich Punkt 1 einmal das probiert:


    Code
    <![CDATA[ Lorem <a href="https://google.com">https://google.com</a>ipsum. ]]>