Inhaltsverzeichnis
In dieser Schritt-für-Schritt-Anleitung lernst du, was Anker-Links sind und wie du diese in WordPress setzen kannst
Einen WordPress Anker setzen macht in einigen Fällen sehr viel Sinn. Gerade bei längeren Artikeln können deine Besucher damit zügig zu einem bestimmten Abschnitt springen, den sie lesen möchten.
Anker-Links werden in WordPress übrigens in vielen Fällen im Inhaltsverzeichnis verwendet. Das hilft deinen Besuchern, bei längeren Artikeln direkt zum gewünschten Bereich zu springen. Auch für die Suchmaschinenoptimierung ist es hilfreich, da Google dadurch wertvolle Infos zur Struktur deiner Seite bekommt.
Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren
Was ist ein WordPress Anker Link?
Bevor ich dir gleich zeigen werde, wie du einen Anker Link setzen kannst, ein paar Basics. Ein WordPress Anker ist ein direkter Verweis auf einen bestimmten Bereich innerhalb der bereits geöffneten Seite (Artikel).
Das ist quasi eine Verlinkung, die allerdings nicht auf eine neue Seite verweist, sondern auf der bestehenden Seite zu einem bestimmten Inhalt springt. Das kann für viele Zwecke sehr nützlich sein und ist somit eine praktische Funktion für deine Website-Besucher.
WordPress Anker setzen
Bereit? Beginnen wir mit einem Live-Beispiel für Ankerverbindungen. Etwas weiter oben hast du das Inhaltsverzeichnis dieses Artikels gesehen. Darin werden die einzelnen Überschriften dargestellt.
Dahinter verstecken sich WordPress Anker-Links. Sobald du auf einen dieser Links klickst, gelangst du zum entsprechenden Bereich innerhalb dieses Artikels. Benutzer können also auf diese Weise zu dem Abschnitt springen, der sie am meisten interessiert.
Du hast grundsätzlich 3 Möglichkeiten, wie du einen Anker setzen kannst. Beide Varianten werde ich dir jetzt zeigen.
Plugin für automatisches Inhaltsverzeichnis
Eine sehr gängige Methode ist es, ein Inhaltsverzeichnis-Plugin zu nutzen. Ein passendes Beispiel ist dieser Artikel. Das Plugin ist in wenigen Minuten installiert und einsatzbereit.
Ich empfehle dir dazu das Plugin „Table of Contents Plus“. Du musst es lediglich installieren, alles Weitere macht das Plugin automatisch für dich.
- Installiere das Plugin und aktiviere es.
- Klicke auf Einstellungen – TOC+.
- Setze die Einstellungen nach deinen Wünschen.
Ein toller Vorteil dieses Plugins ist, dass das Inhaltsverzeichnis automatisch erstellt wird. Du musst dazu keinen Code auf deiner Website einbinden.
Anker mit Gutenberg Editor setzen
Ein durchschnittlicher Benutzer verbringt weniger als ein paar Sekunden, bevor er entscheidet, ob er auf deiner Website bleiben oder diese verlassen möchte. Du hast also nur wenige Sekunden Zeit, um Benutzer zum Bleiben zu bewegen.
Mit gezielten Anker-Links sorgst du dafür, dass dein Besucher schnell und einfach zum gewünschten Inhalt kommt. Mit dem Gutenberg Editor funktioniert das sehr einfach. Dazu gehst du bitte wie folgt vor:
In diesem Beispiel habe ich den Anker-Link „anker1“ gewählt. Achte hier unbedingt auf Groß- und Kleinschreibung. Nur wenn du an der folgenden Stelle den exakt selben Begriff verwendest, wird der Anker-Link funktionieren.
Der erste Schritt besteht darin, den zu verlinkenden Text anzupassen.
- Markiere dazu den entsprechenden Text, den du mit einem Anker Link versehen möchtest.
- Klicke auf das Link-Symbol.
- Trage bei Link das Symbol # (Raute) ein und den Text, den du vergeben möchtest. In meinem Beispiel ist das „#anker1“.
Als Nächstes markierst du die Überschrift, auf die nach dem Klick auf den Link gesprungen werden soll. Im Gutenberg Editor findest du auf der rechten Seite den Bereich „Erweitert“. Klicke bitte darauf. Jetzt findest du ein Feld für den HTML-Anker. Hier trägst du genau dasselbe ein, was du oben als Link definiert hast.
Über diese Vorgehensweise kannst du beliebig viele Anker-Links in WordPress setzen. Das funktioniert sehr einfach und ist in wenigen Minuten umgesetzt.
Anker-Link mit dem Classic Editor erstellen
Mit dem Classic Editor von WordPress funktioniert das Erstellen eines Anker-Links ähnlich. Gehe dazu bitte wie folgt vor:
- Markiere den Textbereich, den du mit einem Anker-Link versehen möchtest.
- Klicke auf das Link-Symbol.
- Der Link startet mit dem Raute-Symbol (#) und anschließend mit dem Text, den du vergeben möchtest (Beispiel: #anker1)
- Als Nächstes wechselst du auf der Seite zu der Überschrift, auf die du verweisen möchtest.
- Wechsle jetzt in den Quellcode und passe den Code wie folgt an.
Code ohne Anker:
<h2>Überschrift Anker-Link</h2>
Code mit Anker
<h2 id=“anker1″>Überschrift Anker-Link</h2>
Es spielt dabei keine Rolle, ob es eine h2 oder eine andere Überschrift/Textpassage ist. Die ID „anker1“ ersetzt du gegen den Link, den du verwendet hast.
WordPress Anker Plugin
Die Alternative zu den gerade vorgestellten Möglichkeiten ist ein Plugin. Ein sehr bekanntes WordPress Anker Plugin ist Folgendes:
Easy Smooth Scroll Links – Smooth Scrolling Anchor
Dieses Plugin fügt dem Editor (Tiny MCE Advanced) einen zusätzlichen Button hinzu. Damit kannst du den Anker-Link erstellen. Zudem gibt es verschiedene Animations-Effekte, die du verwenden kannst.
Ich persönlich empfehle dir, Anker-Links ohne Plugin zu setzen. Denn auch ohne Plugin funktioniert das sehr einfach und schnell. Außerdem hältst du damit dein System sauber.
Tipps für den perfekten WordPress Anker-Link:
- Verwende passende Schlüsselwörter für den Abschnitt, auf den du verlinken möchtest.
- Achte auf die exakte Schreibweise und beachte beim Setzen von WordPress Anker Links auf Groß- und Kleinschreibung.
- Teste den Anker-Link im Browser auf Funktionalität.
FAQ – Fragen & Antworten
Was ist ein Anker Link?
Ein Anker Link ist eine Sprungmarke innerhalb einer Website. Der Begriff Anker steht für den Anfangs- und Endpunkt eines Links. Mit dieser Funktion kannst du innerhalb einer Seite zu einem bestimmten Absatz springen. Das wird beispielsweise für ein Inhaltsverzeichnis sehr gerne genutzt.
Wie setzt man in HTML einen Anker Link WordPress?
Dazu markierst du den Text, welchen du mit deinem Anker Link versehen möchtest. Als Link trägst du dann # und einen Ankernamen ein. Dann wählst du den Textabschnitt, auf dem gesprungen werden soll. Dort fügst du das Attribut: id=„Ankername“ ein.
Kann ich mit dem Classic Editor oder mit dem Gutenberg Editor einen Anker-Link setzen?
Ja. Du kannst sowohl mit dem Classic Editor und auch mit dem Gutenberg Editor einen Anker-Link setzen. Das funktioniert sehr einfach und du benötigst dazu kein Plugin. Wie das funktioniert zeige ich dir im Artikel WordPress Anker-Link einfügen.
Mit welchen WordPress-Plugins kann ich Anker Links setzen?
Ein sehr bekanntes WordPress Anker Plugin ist Easy Smooth Scroll Links – Smooth Scrolling Anchor. Dieses Plugin fügt dem Editor einen neuen Button hinzu, mit dem du dann den Anker Link erstellen kannst. Wenn du ein automatisches Inhaltsverzeichnis nutzen möchtest, dann empfehle ich dir das WordPress-Plugin Table of Contents Plus. Du kannst einen Anker-Link allerdings auch ganz ohne ein Plugin mit HTML erstellen.
