Plugins um Ankerlinks (Sprunglinks) zu setzen

Plugins um Ankerlinks (Sprunglinks) zu setzen.

Einleitung

Im visuellen Editor von WordPress gibt es keinen Button für Ankerlinks.

visueller Editor von WordPress
visueller Editor von WordPress

Wer nicht mit dem Code-Eingabefenster (Texteditor) arbeiten will, um dort im Quelltext nach der richtigen Stelle zu suchen, um per eine ID und einen Ankerlinknamen einzusetzen, der sucht sich zu diesem Zweck ein Plugin für Ankerlinks.

Im Internet habe ich für Ankerlinks noch folgende andere Begriffe gefunden: Sprungmarken, Sprunglinks und Textanker.

Da man mittels eines Links von einer Stelle im Text zu einer anderen Stelle im Text springt, finde ich die Bezeichnung „Sprunglink“ am passendsten.

Gibt man bei https://de.wordpress.org/plugins/ den Begriff „Sprunglink“ oder  den Begriff „Ankerlink“ ein, erhält man (zur Zeit) keine Treffer.

Benutzt man dagegen an dieser Stelle den Begriff „Anchor“ erhält man eine Auswahl von vermeintlich passenden Plugins für Ankerlinks.

Wofür braucht man Ankerlinks?

Um von einer Textstelle zu einer anderen Textstelle innerhalb des gleichen Textes (Beitrag/Seite) zu springen.

 Zum Plugin „Scroll to Anchor“

Dieses Plugin hat im Augenblick über 7000 aktive Installationen.

Bei „Beitrag/Seite erstellen“ und bei „Beitrag/Seite bearbeiten“ findet man jetzt im visuellen Editor einen (neuen) Button zum Setzen von Ankern.

Ankerbutton vom Plugin „Scroll to Anchor“
Ankerbutton vom Plugin „Scroll to Anchor“

Ich möchte jetzt in einem Testbeitrag von „Textstelle 1“ zur Textstelle „It-Door“ springen.

Der Basistext stammt übrigens von Wikipedia.

Plugin „Scroll to Anchor“ Absprungstelle und Landestelle (Anker)
Plugin „Scroll to Anchor“ Absprungstelle und Landestelle (Anker)

Der Anker ist immer an der Stelle, zu der hingesprungen werden soll Folglich markiere  ich <<„It-Door“>> und klicke auf den Ankerbutton.

Ergebnis:

Plugin „Scroll to Anchor“ Anker einfügen
Plugin „Scroll to Anchor“ Anker einfügen

Klick auf den Button „OK“.

Ergebnis:

Plugin „Scroll to Anchor“ Bestätigung des Ankernamens
Plugin „Scroll to Anchor“ Ankername mit Raute

Klick auf den Button „OK“.

Ergebnis:

Plugin „Scroll to Anchor“ Der Anker ist im Text eingebaut
Plugin „Scroll to Anchor“ Der Anker ist im Text eingebaut

Wie man sieht, hat das Plugin „Name des Ankers“ verändert in “name-des-ankers“, also in den Leerstellen einen Bindestrich reingesetzt. Das ist deswegen erwähnenswert, weil der Name des Ankers bei dem Link für die Absprungstelle korrekt eingegeben werden muß, d.h. mit den Bindestrichen. Sonst findet kein Sprung statt.

  • Damit die Absprungstelle diesen Anker überhaupt kennt, muß der Beitrag erstmal gespeichert oder aktualisiert werden.

Dann markiere ich die Absprungstelle <<Textstelle 1>> und klicke auf den Button für Links.

Visueller Editor Button für Links
Visueller Editor Button für Links

Ergebnis:

Plugin „Scroll to Anchor“ Link einfügen für den Sprung zum Anker
Plugin „Scroll to Anchor“ Link einfügen für den Sprung zum Anker

Vor dem Namen des Ankers muß immer die Raute <<#>> gesetzt werden, sonst funktioniert der Ankerlink nicht. In diesem Beispielfalls also so <<#name-des-ankers>>.

Klick auf den Button „Übernehmen“.

Ergebnis: Der Ankerlink funktioniert.

An dem Bild oben sehen Sie die Stelle zu der gesprungen werden soll (<<It-Door>) nicht mehr, weil ich diese Stelle im Textg viel weiter nach unten verschoben habe, damit ein nennenswerter Sprung stattfindet. So wie das Plugin standardmäßig eingestellt ist, ist das eher ein sanftes Runtergleiten als ein Springen.

Bei der Menüfolge „Einstellungen- Lesen“ kann eingestellt werden, in welcher Geschwindigkeit gesprungen wird.

Und zwar hier:

Plugin „Scroll to Anchor“ Sprunggeschwindigkeit einstellen
Plugin „Scroll to Anchor“ Sprunggeschwindigkeit einstellen
Plugin „Scroll to Anchor“ der Shortcode für den Anker im Text
Plugin „Scroll to Anchor“ der Shortcode für den Anker im Text

Im Frontend (z. B. PC-Bildschirm) sieht man diesen Shortcode nicht.

[sta_anchor id=“name-des-ankers“ unsan=“Name des Ankers“] und [/sta_anchor]

Setzt man hier allerdings bei der Menüfolge „Einstellungen- Lesen“ ein Häkchen

Plugin „Scroll to Anchor“ zeige Anker im Frontend
Plugin „Scroll to Anchor“ zeige Anker im Frontend

dann sieht das im Frontend (z. b. PC-Bildschirm) so aus:

Plugin „Scroll to Anchor“ Shortcode im Frontend
Plugin „Scroll to Anchor“ Shortcode im Frontend

 

  • Mit der oben geschilderten Verfahrensweise ließ sich auch erfolgreich ein Ankerlink innerhalb 1 Seite erstellen.

Zum Plugin “Easy Smooth Scroll Links”

Dieses Plugin hat im Augenblick über 40.000 aktive Installationen.

Wie man  bei den Einstellungen dieses Plugins erkennen kann,  kann man mit diesem Programm keine Ankerlinks setzen.

Plugin “Easy Smooth Scroll Links” Einstellungsoptionen
Plugin “Easy Smooth Scroll Links” Einstellungsoptionen

Zum Plugin „TinyMCE Advanced“

Dieses Plugin hat im Augenblick über 1 Million aktive Installationen.

Nach der Installation und Aktivierung des Plugins wird bei „Beitrag/Seite erstellen“ und bei „Beitrag/Seite bearbeiten“ der visuelle Editor  nicht automatisch um einen (neuen) Button zum Setzen von Ankerlinks ergänzt. TinyMCE Advanced fügt dem visuellen Editor automatisch neue Buttons hinzu, aber eben keinen Button für Anker.

Diesen Service hatte es ja bei dem Plugín „Scroll to Anchor“ gegeben.

Um nun einen Button für Anker in den visuellen Editor zu integrieren, ist Folgendes zu tun:

Menüfolge „Einstellungen- TinyMCE Advanced“ findet man bei unbenutzte Buttons einen Button für Anker.

Plugin „TinyMCE Advanced“ Anker Button
Plugin „TinyMCE Advanced“ Anker Button

Diesen Button zieht man mit der Maus in dieser Maske in den visuellen Editor und klickt auf den Button „Änderungen speichern“.

Ergebnis: Bei „Beitrag/Seite erstellen“ und bei „Beitrag/Seite bearbeiten“ ist der Button für den Anker im visuellen Editor. und klickt auf den Button „Änderungen speichern“.

Plugin „TinyMCE Advanced“ Anker Button in viusellen Editor
Plugin „TinyMCE Advanced“ Anker Button in viusellen Editor

Man hätte den Anker-Button auch mitten in die anderen Button reinziehen können, aber ich denke, wer wegen eines Anker-Buttons extra ein Plugin einbaut, der will diesen Button auch an exponierter Stelle haben und nicht irgendwo mittendrin.

Die weitere Vorgehensweise ist wie gehabt.

  • Man setzt den Cursor an die Stelle, wo man hinspringen will, klickt auf den Ankerbutton und vergibt dabei einen Namen für den Anker.
Plugin „TinyMCE Advanced“ Anker Name
Plugin „TinyMCE Advanced“ Anker Name

Man markiert die Absprungstelle und erstellt mit dem Linkbutton einen Link zu der Stelle, zu der man hinspringen will. Wie vorhin auch ist bei diesem Ankerlink vor den Namen des Ankers eine Raute zu setzen.

Plugin „TinyMCE Advanced“ bei der Absprungstelle den Ankerlink setzen
Plugin „TinyMCE Advanced“ bei der Absprungstelle den Ankerlink setzen

Es gibt aber dennoch Unterschiede bei den Plugins:

 

Bei „Beitrag bearbeiten“ sieht man bei den Plugin „TinyMCE Advanced“ nicht dieses Geschreibsel „[sta_anchor id=“anker1″ unsan=“anker1″]“ an der Ankerstelle, sondern nur ein dezentes Ankersymbol an der Ankerstelle.

Plugin „TinyMCE Advanced“ dezentes Ankerzeichen
Plugin „TinyMCE Advanced“ dezentes Ankerzeichen

Ankerstelle war im hier im Beispiel <<Itdoor>> und das kleine Ankersymbol liegt auf dem ersten Buchstaben des Ankers.

 

  • Es findet ein richtiger Sprung statt und kein Gleiten. Ich habe keine Einstellung bei dem Plugin „TinyMCE Advanced“ gefunden, an der man eine Animationsgeschwindigkeit einstellen kann.
  • Wenn das Plugin „TinyMCE Advanced“ deaktiviert ist, kann man noch zum Anker springen. Wenn das Plugin „Scroll to Anchor“ deaktiviert ist, kann man nicht mehr zum Anker springen.
  • Wenn das Plugin „TinyMCE Advanced“ gelöscht ist, kann man noch zum Anker springen. Wenn das Plugin „Scroll to Anchor“ gelöscht ist, kann man nicht mehr zum Anker springen.

Gemeinsamkeiten der Plugins

Einen Sprung von Beitrag1 Textstelle1/Seite1 Texstelle1 zum Beitrag2 Textstelle2/zur Seite2 Textstelle2 habe ich bei dem Standard-Theme „Twenty Seventeen nicht hinbekommen.

Der  Ankername wird nicht gefunden.

Daher habe ich erst gar nicht probiert, ob ein Sprung von einen Beitrag zu einer Seite ode umgekert möglich ist.

Wenn Sie den Link an der Absprungstelle entfernen, bleibt der Anker erhalten.

Eine Übersicht für alle Ankerlinks habe ich nicht gefunden. Ebenfalls habe ich keine Stelle oder einen Button gefunden, an der oder mit dem ich Ankerlinks löschen kann.

Natürlich kann man jeden Ankerlink manuell löschen.

Mit dem Plugin „Broken Link Checker“ nach Ankerlinks suchen?

Mit dem Plugin „Broken Link Checker“ kann man keine Anker entdecken, was von dem Plugin auch nicht behauptet wird.

Mit dem Plugin „Broken Link Checker“ konnte ich die Ankerlinks nicht unmittelbar entdecken.

Wenn man die URL oder wie hier in dem Beispiel den Linktext kennt, dann kann was finden.

Plugin „Broken Link Checker“ Suche nach Links
Plugin „Broken Link Checker“ Suche nach Links

Das Suchergebnis sieht dann so aus.

Plugin „Broken Link Checker“ Suchergebnis Ankerlink
Plugin „Broken Link Checker“ Suchergebnis Ankerlink

Man müßte dann im Kopf haben, daß „Textstelle1“ ein Ankerlink ist.

Bei dem Plugin „Broken Link Checker“ gibt es keine Link-Art oder keinen Link-Typ „Ankerlink“.

Plugin „Broken Link Checker“ Link-Arten
Plugin „Broken Link Checker“ Link-Arten

Schlußwort

Ich will ich nicht behaupten, daß kostenlose Plugins das alles können müssen, was hier in dieser Abhandlung aufgelistet worden ist. Das sollen lediglich klarstellende Hinweise sein, was geht und was nicht geht.

Wer Ankerlinks ohne Plugins erstellen will, findet hier eine gute Erklärung [Link].

Zurück zum WordPress Plugin Verzeichnis von ItDoor

zur Startseite von ItDoor