Elementor Anker Link Setzen

Das Setzen von Ankerlinks in Elementor ist eine hervorragende Möglichkeit, die Navigation auf Ihrer Website zu verbessern und den Nutzern ein nahtloses Erlebnis zu bieten. Ankerlinks sind besonders nützlich auf langen Seiten, wo sie den Benutzern ermöglichen, direkt zu bestimmten Abschnitten zu springen. In diesem Artikel zeigen wir Ihnen, wie Sie in Elementor einfach und effektiv Ankerlinks setzen können.

wordpress Elementor Anker Link Setzen

So setzen Sie einen Ankerlink in Elementor

Methode 1: CSS ID direkt im Element vergeben

  1. Element auswählen
    Wählen Sie das Elementor-Element aus, zu dem der Ankerlink springen soll.
  2. CSS ID vergeben
    Gehen Sie zu den Einstellungen des Elements, navigieren Sie zum Reiter “Erweitert” und geben Sie unter “CSS ID” eine eindeutige ID ein, z.B. infos.
  3. Link setzen
    • Text oder Button auswählen
      Markieren Sie den Text oder wählen Sie den Button aus, der zum Ankerlink führen soll.
    • Link hinzufügen
      Geben Sie in das Link-Feld die ID des Menüankers ein, z.B. #infos.
  4. Änderungen speichern
    Speichern Sie Ihre Änderungen und veröffentlichen Sie die Seite.

Methode 2: Menüanker-Widget verwenden

  1. Widget-Auswahl öffnen
    Öffnen Sie den Elementor-Editor und wählen Sie die Seite aus, auf der Sie einen Ankerlink setzen möchten.
  2. Menüanker-Widget hinzufügen
    Ziehen Sie das Widget “Menüanker” aus der Widget-Leiste in den Bereich der Seite, den Sie als Ankerziel verwenden möchten.
  3. ID vergeben
    Geben Sie dem Menüanker eine eindeutige ID, z.B. kontakt.
  4. Link zum Anker setzen:
    • Text oder Button auswählen: Markieren Sie den Text oder wählen Sie den Button aus, der zum Ankerlink führen soll.
    • Link hinzufügen: Geben Sie in das Link-Feld die ID des Menüankers ein, z.B. #kontakt.
  5. Änderungen speichern
    Speichern Sie Ihre Änderungen und veröffentlichen Sie die Seite.

Weitere Möglichkeiten zum Setzen von Ankerlinks

Ankerlinks in der Navigation

  1. Menüeinträge bearbeiten: Gehen Sie zu Ihrem WordPress-Dashboard und navigieren Sie zu “Design” > “Menüs”.
  2. Individuelle Links hinzufügen: Fügen Sie einen neuen Menüeintrag hinzu und geben Sie die URL des Ankers ein, z.B. #kontakt.
  3. Menü speichern: Speichern Sie das Menü, um die Änderungen zu übernehmen.

Ankerlinks in Texteditoren

  1. Texteditor öffnen: Öffnen Sie den Texteditor von Elementor oder einen anderen Texteditor auf Ihrer WordPress-Seite.
  2. HTML-Code einfügen: Fügen Sie HTML-Code ein, um den Anker zu setzen, z.B. <a id="kontakt"></a>.

Ankerlinks in anderen Widgets

  1. Widget bearbeiten: Wählen Sie das Widget aus, in dem Sie den Anker setzen möchten.
  2. Erweitertes Menü: Gehen Sie zum Reiter “Erweitert” und geben Sie unter “CSS ID” die Anker-ID ein.

Tipps und Tricks

Optimale Platzierung

Setzen Sie Ankerlinks strategisch ein, um die Benutzerfreundlichkeit zu erhöhen. Platzieren Sie sie an den wichtigsten Abschnitten Ihrer Seite, wie Kontaktformulare, Dienstleistungen oder speziellen Angeboten.

Eindeutige IDs

Vergeben Sie eindeutige und sinnvolle IDs, um Verwirrung zu vermeiden und die Wartung Ihrer Website zu erleichtern.

Testen Sie die Links

Stellen Sie sicher, dass alle Ankerlinks korrekt funktionieren, indem Sie die Seite in verschiedenen Browsern und Geräten testen.

Fazit

Das Setzen von Ankerlinks in Elementor ist eine einfache und effektive Methode, die Navigation Ihrer Website zu verbessern. Mit den oben genannten Schritten und Tipps können Sie Ihre Website benutzerfreundlicher gestalten und den Nutzern ein besseres Erlebnis bieten. Wenn Sie weitere Unterstützung benötigen oder Ihre Website optimieren möchten, zögern Sie nicht, uns bei beSIRIOus zu kontaktieren.

FAQ

Ein Ankerlink ist ein Link, der Benutzer zu einem bestimmten Abschnitt auf derselben Seite führt. Dies ist besonders nützlich auf langen Seiten, um die Navigation zu verbessern und den Nutzern ein nahtloses Erlebnis zu bieten.

Es gibt zwei Hauptmethoden:

  • CSS ID direkt im Element vergeben: Wählen Sie das gewünschte Element, geben Sie unter “Erweitert” eine CSS ID ein und setzen Sie den Link auf diese ID.
  • Menüanker-Widget verwenden: Ziehen Sie das Menüanker-Widget auf die Seite, vergeben Sie eine ID und setzen Sie den Link auf diese ID.

Die schnellste Methode ist das Vergeben einer CSS ID direkt im Element. Dies ermöglicht es Ihnen, Ankerlinks ohne zusätzliche Widgets oder komplexe Einstellungen zu setzen.

Ja, Sie können Ankerlinks in der Navigation verwenden, indem Sie im WordPress-Dashboard zu “Design” > “Menüs” gehen, einen individuellen Link hinzufügen und die URL des Ankers eingeben.

Überprüfen Sie, ob die CSS ID korrekt und eindeutig ist. Stellen Sie sicher, dass der Link die richtige ID (mit #) enthält. Testen Sie die Seite in verschiedenen Browsern und Geräten, um sicherzustellen, dass es keine Kompatibilitätsprobleme gibt.