So erstellen und verwenden Sie einen Bild-Hotspot auf Ihrer WordPress-Website

Bilder und Videos machen Websites immer ansprechender. Ein Hotspot-Bild auf Ihrer WordPress-Website kann jedoch alle bisherigen Rekorde bei der Verwendung normaler Bilder brechen. Hotspot-Bilder enthalten anklickbare Bereiche, die den Besuchern Ihrer Website weitere Informationen bieten. Vorher war das Erstellen eines Image-Hotspots gar nicht so einfach. 

Glücklicherweise ist das Erstellen eines Bild-Hotspots jetzt dank der tollen WordPress-Add-ons ganz einfach geworden. Es ist sogar noch das einfachste geworden, weil ElementsKit hinzufügen Auf.

ElementsKit ist ein All-in-One-Addon für Elementor das bietet 85+ Widgets, 500+ Blöcke, 25+ fertige Homepages und vieles mehr. Darüber hinaus bietet es kostenlose Widgets, Pro-Widgets und erweiterte Module, die die Anpassung Ihrer Website auf ein Niveau bringen, das Sie sich nicht vorstellen können. Sie können sogar in wenigen Minuten interaktive Hotspot-Bilder erstellen.

Hier in diesem Artikel verraten wir Ihnen, wie einfach Sie mit dem ElementsKit Hotspot-Bilder erstellen können. Außerdem erfahren Sie, wie Sie interaktive Imagemaps erstellen. Nach dem Lesen dieses Artikels können Sie nicht nur Imagemaps, sondern auch beliebige Hotspot-Bilder erstellen.

Was ist ein interaktiver Bild-Hotspot auf Ihrer WordPress-Website?

Hotspot-Bilder sind interaktive Bilder die Hotspot-Symbole auf dem Bild enthalten. Diese Hotspot-Symbole enthalten Popup-Fenster oder Tooltips, die Texte, Bilder, Links usw. enthalten. 

Die Erstellung interaktiver Bilder wird Ihnen bei der Bereitstellung helfen Mehr Info durch anklickbare Bereiche. Wenn Sie einfach ein Hotspot-Symbol zu einem WordPress-Hotspot-Bild hinzufügen, wird es die Aufmerksamkeit Ihrer Besucher auf sich ziehen. 

Darüber hinaus werden Ihre Benutzer oder Besucher aufgrund der auffälligen und informativen Fotos mehr Zeit auf Ihrer Website verbringen wollen. Als Ergebnis werden Sie eine beeindruckende Verbesserung Ihres Wohlbefindens feststellen Absprungrate Und Wechselkurs wegen WordPress-Hotspot-Bildern. 

Warum sollten Sie interaktive Hotspot-Bilder erstellen?

Interaktive Hotspot-Bilder auf Ihrer WordPress-Site ziehen die Aufmerksamkeit Ihrer Besucher auf sich und reduzieren die Anzahl der Besucher Absprungrate. Auch diese Bilder können wirkungsvoller sein als Videos. Außerdem finden Sie viele Beispiele für leistungsstarke Hotspot-Bilder.

Sie möchten aber sicher genau wissen, welchen Nutzen Sie aus diesen Bildern ziehen. Warum sollten Sie sich bei der Erstellung dieser Bilder besonders viel Mühe geben? 

Wenn Sie diese Fragen haben, sind Sie sicherlich nicht allein. Auch ich bin beim Erstellen eines Elementor-Hotspot-Bildes mit diesen Fragen konfrontiert worden. Hier finden Sie Antworten auf Ihre Fragen, warum Sie bei der Erstellung von Bild-Hotspots besondere Anstrengungen unternehmen sollten:

1. Die interaktiven Hotspot-Bilder helfen Ihnen dabei interagieren mit Ihren Benutzern mehr. Die Verwendung eines Bildes auf Ihrer Website ist immer von Vorteil. Wenn Sie jedoch ein Hotspot-Bild verwenden, sind es mehr.

2. Es wird Ihnen bei der Bereitstellung helfen Mehr Info an Ihren Besucher. Als Hotspot-Bilder enthalten sie anklickbare Bereiche, die Tooltips oder Fenster enthalten. Diese Fenster enthalten Fotos, Texte, Links usw., um zusätzliche Informationen bereitzustellen.

3. Hotspot-Bilder sind mobil ansprechbar. 

Im Jahr 2021 Statista hat in einer Studie herausgefunden, dass „mehr als 47 Prozent Website-Besucher mobile Geräte verwenden, um Websites in den Vereinigten Staaten zu besuchen“. 

Sie können also die Notwendigkeit eines auf Mobilgeräte reagierenden Bildes nicht ignorieren.

4. Wenn Sie mehr mit Ihren Benutzern interagieren können, können Sie sie auch auf Ihrer WordPress-Site halten. Infolgedessen ist die Absprungrate Die Anzahl der Zugriffe auf Ihrer Website wird ebenfalls sinken.
5. Wenn Sie Hotspots hinzufügen, um interaktive Bilder zu erstellen, erhöht dies das Benutzererlebnis und Wechselkurs Ihrer Website. Sie werden eine sichtbare Verbesserung beim Hinzufügen von Hotspot-Bildern feststellen.

Nachdem Sie all diese Vorteile kennengelernt haben, haben Sie möglicherweise Fragen. 

Wie erstelle ich Hotspot-Bilder? Was ist der einfachste Weg, einen Bild-Hotspot für Ihre Website zu erstellen? 

Rechts?

Lesen Sie weiter, um Ihre Lösung zu finden. 

Erstellen Sie mit ElementsKit interaktive Hotspot-Bilder auf Ihrer WordPress-Website

Durch das Hinzufügen von Hotspot-Bildern zu Ihrer Website können Sie mehr als je zuvor mit Ihren Besuchern interagieren. Außerdem wird es Ihren Kunden nie langweilig, sich mit den Inhalten Ihrer Website zu beschäftigen. 

Glücklicherweise können Sie jetzt mit ElementsKit interaktive Bilder für Ihre WordPress-Website erstellen, ohne viel Zeit zu verschwenden. Außerdem können Sie einen Image-Hotspot erstellen Elementor-Off-Canvas-Menü, Bildaustauscheffekt in WordPress, usw. ohne Codierung.

Möchten Sie mehr über ElementsKit erfahren?

Dann lies ElementsKit: Das beste Add-on für Elementor Artikel.

Mit dem ElementsKit-Widget können Sie in acht einfachen Schritten interaktive Bild-Hotspots erstellen. Sind Sie gespannt darauf, wie Sie dies tun können? 

Lass uns eintauchen.

Schritt 1: Bearbeiten Sie eine neue Seite mit Elementor, um interaktive Bilder zu erstellen.

Zuerst müssen Sie ElementsKit installieren und aktivieren. Gehen Sie dann zu Ihrem WordPress-Dashboard und besuchen Sie Seiten>>Neu hinzufügen, um einen interaktiven Bild-Hotspot zu erstellen.

Klicken Sie anschließend auf die Schaltfläche „Mit Elementor bearbeiten“, um ein neues Hotspot-Bild zu erstellen.

Schritt 2: Suchen Sie das Hotspot-Widget und wählen Sie es aus.

In diesem Schritt müssen Sie im Widget-Suchfeld nach einem Hotspot-Widget suchen.

Ziehen Sie nun das Hotspot-Widget und fügen Sie es wie im Bild zum neuen Abschnitt hinzu.

Schritt 3: Bearbeiten Sie den Inhalt Ihrer Bild-Hotspots.

Nachdem Sie das Hotspot-Widget hinzugefügt haben, ist es nun an der Zeit, den Inhalt des Widgets zu bearbeiten. Wählen Sie dafür den Stil und das Hintergrundbild aus Ihrer WordPress-Medienbibliothek oder Ihrem Computer. Ich verwende hier ein Google Maps-Bild. Laden Sie es jetzt hoch.

Sie können mit dem ElementsKit-Hotspot-Widget auch Folgendes bearbeiten:

• Glanz zeigen: Sie können das Leuchten, das um den Zeiger herum erscheint, ein- und ausblenden.
• Klicken oder bewegen Sie den Mauszeiger: Diese Option hilft Ihnen bei der Entscheidung, ob Ihre Tooltips beim Klicken oder Hovern angezeigt werden sollen. Wenn Sie Hover wählen, werden Ihre Tooltips beim Hover oder beim Klicken angezeigt, wenn ein Benutzer auf die Hotspots klickt.
• Aktiv oder nicht: Mit dieser Option können Sie auch alle Tooltips ein- oder ausblenden.

Nachdem Sie die oben genannten Dinge bearbeitet haben, fügen Sie einen Tooltip für Ihre Hotspot-Imagemap hinzu. Klicken Sie dazu auf das im Bild markierte Kästchen.

Jetzt müssen Sie einen Titel und eine Beschreibung für Ihren Tooltip hinzufügen. Fügen Sie dazu einen Titel und eine Beschreibung für Ihren Tooltip ein. 

Fügen Sie anschließend ein passendes Bild für Ihren Tooltip hinzu. Es kann ein beliebiges Bild sein. 

Jetzt müssen Sie die Tooltip-Position anpassen. Mit der folgenden Option können Sie Ihren Zeiger von links nach rechts oder von oben nach unten bewegen. Stellen Sie den Zeiger ein. Sie können auch weitere Hotspots hinzufügen, indem Sie auf die Schaltfläche „Element hinzufügen“ klicken.

Schritt 4: Passen Sie den Stil des Inhalts des Bild-Hotspots WordPress an.

In diesem Schritt müssen Sie den Stil Ihres Hotspot-Inhalts bearbeiten. Wählen Sie eine geeignete Hintergrundfarbe und ein geeignetes Bild, um den Standardinhaltsstil Ihres Elementor-Hotspot-Bildes zu ändern. Legen Sie nun Abstand, Breite und Ausrichtung für Ihren Standardinhalt fest.

Schritt 5: Passen Sie den Stil des Zeigers an, um interaktive Bilder zu erstellen.

In diesem Schritt müssen Sie den Zeiger anpassen. Hier können Sie folgende Bereiche anpassen:

• Hintergrundfarbe: Wählen Sie die Hintergrundfarbe für Ihren Zeiger.
• Zeigergröße: Legen Sie die Größe Ihres Zeigers fest. Sie können es vergrößern, indem Sie den Kreis nach rechts ziehen.
• Randradius: Mit dieser Option können Sie bei Bedarf den Radius Ihres Zeigers ändern.
• Box Schatten: Mit dieser Option können Sie mit dem Zeiger Schatten hinzufügen.
• Randtyp: Wählen Sie den Rahmentyp aus, den Sie für Ihren Zeiger wünschen.
• Punktfarbe: Passen Sie die Farbe des Punktes an, der sich im Zeiger befindet.
• Leuchtfarbe: Ändern Sie bei Bedarf die standardmäßige Leuchtfarbe, die um den Zeiger herum angezeigt wird.

Schritt 6: Ändern Sie den Stil des Titels Ihres Hotspot-Bildes.

Für die Gestaltung des Titels müssen Sie die richtige Typografie für Ihren Titel auswählen. Im Bereich Typografie können Sie folgende Bereiche ändern:

• Familie.
• Größe.
• Gewicht.
• Verwandeln.
• Stil.
• Dekoration.
• Zeilenhöhe.
• Buchstaben-Abstand.

Sie müssen außerdem die Textfarbe auswählen und den erforderlichen Rand für Ihren Titel festlegen.

Schritt 7: Passen Sie den Stil der Beschreibung und des Bildes an.

Hier müssen Sie die Beschreibung des Tooltip-Inhalts bearbeiten. Dies entspricht der Titelanpassung. Legen Sie nun die Bildposition fest, an der es in Ihrem Tooltip erscheinen soll. 

Ändern Sie abschließend den Rand und die Breite Ihres Bildes nach Ihren Wünschen.

Schritt 8: Veröffentlichen Sie die vorgenommenen Änderungen zu Ihrem Hotspot-Bild.

Nachdem wir alle Änderungen vorgenommen haben, ist es nun Zeit für die Veröffentlichung. Klicken Sie auf die Schaltfläche „Veröffentlichen“ und Sie sind bereit für Ihr Hotspot-Bild.

Hier ist die Ausgabe meiner interaktiven Hotspot-Bildkarte:

Notiz:
Sie können Ihr Hotspot-Bild auch erweitert anpassen. Beispielsweise können Sie einige Teile Ihres Hotspot-Bilds „einkleben“. Sie können auch Bedingungen und Effekte für Ihre Bilder festlegen. Darüber hinaus steht Ihnen das Hinzufügen eines erweiterten Tooltips zur Verfügung. Sie können Änderungen auch überwachen, indem Sie auf die entsprechende Schaltfläche klicken. Ihre Bearbeitung wird auf einer neuen Registerkarte angezeigt, wenn Sie auf die responsive Schaltfläche klicken.

Immer noch verwirrt?

Sehen Sie sich das Demovideo zur Verwendung des Hotspot-Widgets an:

Warum sollten Sie sich für ElementsKit entscheiden, um interaktive Hotspot-Bilder zu erstellen?

Es gibt viele Add-ons in WordPress, die ein Hotspot-Widget zum Erstellen von Hotspot-Bildern bieten. 

Aber warum sollten Sie alle anderen Add-ons meiden? Warum müssen Sie sich nur für ElementsKit entscheiden, um hochwertige interaktive Hotspot-Bilder zu erstellen?

Warum gilt es als großartiges Tool für Elementor?

Die ElementsKit Pro-Version bietet ein Hotspot-Widget. Daher ist es normal, dass Sie diese Fragen haben. Den Leuten ist es egal, wenn sie eine kostenlose Version eines Plugins verwenden. Dies ist jedoch der Fall, wenn sie eine kostenpflichtige Version verwenden. Weil die Leute das beste Produkt kaufen wollen, wenn sie dafür bezahlen. Du bist nicht anders.

Hier sind die Gründe, warum Sie sich für ElementsKit statt für andere Add-ons entscheiden sollten:

• ElementsKit bietet Ihnen hervorragende Unterstützung. Das Support-Team ist immer bereit, Lösungen für alle Probleme zu finden, die bei der Verwendung dieses Add-Ons auftreten. Außerdem erhalten Sie die schnellste Antwort auf alle Ihre Fragen. Diese Unterstützung werden Sie von anderen Addons kaum bekommen.
• Wegen seiner benutzerfreundlich Funktionen haben selbst Einsteiger keine Probleme mit der Bedienung. 

• Sie können Hotspot-Bilder nach Ihren Wünschen erstellen. Auch erweiterte Anpassungsmöglichkeiten stehen Ihnen offen. Sie können nicht nur Hotspot-Bilder erstellen, sondern auch individuelle Bilder erstellen Header, Fusszeile, Dropdown-Menü usw. mit ElementsKit.

• ElementsKit hat nicht nur eine hervorragende Benutzererfahrung geboten. Es wird kontinuierlich aktualisiert, um Ihren Anforderungen gerecht zu werden. Darüber hinaus ist es so Vollständig kompatibel mit Elementor. Dieses Benutzererlebnis erhalten Sie jedoch nicht, wenn Sie andere Add-ons und Plugins installieren oder verwenden.

• Ob Sie Eigentümer eines sind große oder kleine Website, können Sie dieses Add-on ohne Probleme verwenden. Einige Add-ons werden Ihren Anforderungen jedoch nicht gerecht.
• Einige Add-ons können Ihre Website beschädigen. Dieses Problem tritt nicht auf, wenn Sie Benutzer von ElementsKit werden.

Dies sind die wichtigsten Gründe, die Sie dazu veranlassen, das zu installieren und zu verwenden ElementsKit hinzufügen Auf. Aufgrund der oben genannten Vorteile verlassen viele Benutzer andere Add-ons und entscheiden sich für ElementsKit. Zum Zeitpunkt des Schreibens dieses Blogs beträgt der Download von ElementsKit pro Woche 117,238+. Das beweist, dass Benutzer ElementsKit lieben.

Möchten Sie mehr über die Reise von ElementsKit erfahren? Dann lies Die Reise von ElementsKit: All-in-One-Add-on für Elementor.

Beginnen Sie mit Ihrem Hotspot-Image

Die Verwendung von Bildern auf Ihrer WordPress-Site kann die effektivste Möglichkeit sein, eine emotionale Verbindung zu Ihren Besuchern herzustellen. Aber Hotspot-Bilder auf Ihrer WordPress-Site können das Ganze auf eine andere Ebene bringen. Glücklicherweise wissen Sie jetzt, wie Sie in wenigen Minuten Hotspot-Bilder erstellen können ElementsKit. 

Wenn Sie beim Erstellen von Hotspot-Bildern immer noch unsicher sind, teilen Sie uns dies bitte im Kommentarbereich mit oder posten Sie Ihre Fragen auf Wpmet-Community. Wir werden versuchen, Ihr Problem zu lösen. Teilen Sie uns auch mit, ob dieser Inhalt hilfreich ist.