In-Page-Panel: Imagemap

Mit der Imagemap-Funktion können Nutzer interaktive Hotspot-Bereiche direkt auf einer Seite erstellen. Nach dem Hochladen eines Bildes können Nutzer benutzerdefinierte Hotspot-Formen zeichnen, darunter Rechtecke, Kreise und Freihandbereiche, und diese mit Tooltips versehen, die bei Mauszeigerkontakt einen Titel und eine Beschreibung anzeigen. Jeder Hotspot kann über die Konfiguration so konfiguriert werden, dass er auf interne oder externe URLs verweist, was eine umfangreiche Navigation und kontextbezogene Interaktionen innerhalb der Seite ermöglicht.

Konfiguration

Die Image Map wird direkt auf einer Seite mithilfe des dritten Icons in der Liste erstellt.

image-20260323-093616.png
Übersicht über die Panels auf der Seite

Entstehungsprozess

  • Bild hochladen.

  • Eine oder mehrere Formen (Rechtecke) auf das Bild zeichnen, um anklickbare Bereiche zu definieren.

  • Konfigurieren der Tooltips, die beim Bewegen des Mauszeigers angezeigt werden.

  • Tastaturkürzel:

    • Shift: Hinzufügen neuer Punkte für die Formerstellung.

    • entf.: Eine Form entfernen.

    • esc: Verlasse den Formmodus, um Links und Text zu Hinzufügen.

Panel-Einstellungen

 

image-20260323-092805.png
Einstellungen für Image Maps

Als globales Panel festlegen: Stellen Sie dieses Panel auf mehreren Seiten zur Verfügung. Zukünftige Bearbeitungen wirken sich auf alle Seiten aus, auf denen es verwendet wird.

image-20260323-091346.png
Einstellungen für Image Maps

URL: URL-Zuweisung, interne und externe URLs können hinzugefügt werden

In einem neuen Tab öffnen: Legt fest, ob die hinzugefügte URL in einem neuen Tab geöffnet wird. Andernfalls wird die Seite im selben Tab geöffnet.

Tool-Tipp

  • Titel: Der Titel wird beim Darüberfahren mit der Maus angezeigt

  • Beschreibung: Die Beschreibung wird angezeigt, wenn man mit der Maus darüberfährt

 

image-20260323-091858.png
Beispiel für Hover-Informationen

 

Verwandte Funktionen

Page-Editor