So fügen Sie WordPress-Anker-Hyperlinks in WordPress ein (3 Techniken)

Veröffentlicht: 2022-04-26

Viele der Designentscheidungen, die Sie auf Ihrer Website treffen, beziehen sich auf die Benutzerfreundlichkeit und das Kundenerlebnis (UX). Darüber hinaus haben Website-Inhalte – standardmäßig das Durchsuchen der Webseiten Ihrer Website – einen hohen Preis. Wenn Sie beide kombinieren, werden Sie oft über Mittel nachdenken, um die UX Ihrer Informationen zu unterstützen. WordPress-Anker-Backlinks sind eine Grundvoraussetzung für die UX Ihrer Inhalte.

Denken Sie an Anker-Einweg-Links als Inline-Navigation für den betreffenden Artikel. Sie können sie überall entdecken, aber Überschriften sind ein weit verbreiteter Anwendungsfall. Dies ermöglicht es einem Leser, in die Nähe einer Aufmachung zu springen, wenn er möchte, ohne sich verirren zu müssen. Es ist eine erstklassige UX-Sache, die es zu berücksichtigen gilt, und eine Sache, über die sich die meisten Website-Hausbesitzer vorstellen sollten.

Um Ihnen zu demonstrieren, wie unkompliziert es ist, sie zu verwenden, wird dieser Artikel bei WordPress Anker-Backlinks erscheinen. Bevor wir uns mit den verschiedenen Techniken befassen, die Sie integrieren können, lassen Sie uns darüber sprechen, was sie sind und was sie für Sie tun können.

Was eine Ankerverbindung ist

Im typischen Sinne ist eine Ankerverbindung ein anklickbarer Teil der Inline-Navigation. Es unterscheidet sich von einem Inhaltsstoff und bringt Sie zu einer späteren Ebene auf der Webseite. Wir verwenden sie bei WPKube, um Ihnen zu helfen, zu den einzelnen Aktionen in Tutorials zu springen:

Ein WordPress-Ankerlink auf einem WPKube-Beitrag.

Wenn Sie einfach auf die URL klicken, springt die Website zu dem entsprechenden Teil, den Sie angeben. Es ist eine sehr einfache Implementierung, die einen fantastischen Effekt auf die Benutzerfreundlichkeit Ihrer Website haben kann. Wir werden als nächstes über einige dieser Umstände sprechen.

Warum Sie Anker-Einweg-Links in WordPress verwenden sollten

Wir erwähnen die Benutzerfreundlichkeit als wesentlichen Motivator für die Verwendung von WordPress-Anker-Backlinks, und dies ist ein wichtiger Grund für deren Verwendung. Auf der anderen Seite gibt es jede Menge Anwendungsszenarien, um sie zu Ihrer Website hinzuzufügen. Zum Beispiel:

  • Wenn Sie Ihren Lesern sehr lange schriftliche Inhalte (etwa 3.000-Term-Posts) zur Verfügung stellen möchten, haben Sie häufig ein Inhaltsverzeichnis. Dies ist eine maßgeschneiderte Verwendung für eingehende Ankerlinks.
  • Anker können auch funktionieren, wenn Sie Lesezeichen-Beiträge teilen. Wenn Sie einen Anker in der URL enthalten, springt ein Leser direkt zu der Bühne, die Sie sehen möchten.
  • Ihre Suche nach Suchmaschinenoptimierung (Search Engine Optimization) kann verbessert werden, vor allem, weil Suchmaschinen unter bestimmten Umständen diese WordPress-Anker-Einweglinks als andere Einträge anzeigen.

Kurz gesagt, wenn Sie möchten, dass Ihr Publikum auf Ihrer Website bleibt und mit Ihren Artikeln interagiert, sind eingehende WordPress-Ankerlinks eine entscheidende Waffe im Kampf um den Verkehr. Wie Sie sie zu Ihrer Website hinzufügen können, zeigt Ihnen die zukünftige Anzahl der Abschnitte.

So binden Sie Anker-Backlinks in beliebigen HTML-Code ein

Die Grundlage für das Einbinden von WordPress-Anker-Hyperlinks ist HTML. Sie können diese auf jeder Internetseite verwenden, nicht nur in WordPress. Es gibt zwei Teile: den Anker und das Tag.

Zuerst erhöhen Sie den Anker-Backlink wie jeden anderen Hyperlink – indem Sie Tags verwenden. Nur für die Verbindung verwenden Sie direkt davor ein 'Octothorpe' (auch als Hash- oder Pfund-Signal bekannt):

Click on further more down the web page

Wenn Sie darauf klicken, geht die URL jedoch nirgendwo hin. Damit es irgendwo hingeht, fügen Sie später in den Artikeln den identischen href -Hyperlink als id ein, ohne dass das octothorpe erforderlich ist:

Unser verankerter Kurs

Dadurch werden beide Tags miteinander verknüpft und die Inline-Navigation erstellt, die Sie haben müssen. Beachten Sie, dass wir in diesem Artikel ein Überschriften-Tag verwenden, dies kann jedoch ein beliebiges HTML-Tag sein. Sie können gerne Absatz-Tags, Bild-Tags oder andere Aspekte Ihres HTML-Codes verwenden, wenn dies die Kunden dahin bringt, wo sie sein müssen.

So fügen Sie WordPress-Ankerlinks hinzu (3 Methoden)

Wir werden Ihnen jetzt ein ernstzunehmendes Beispiel für WordPress-Anker-Backlinks zeigen! Hier ist, womit wir uns wahrscheinlich in den nächsten Abschnitten befassen werden:

  • Sie können Anker für Funktionen des Blockeditors und etablierte IDs für andere Komponenten hinzufügen. Dies ist auch im Classic Editor wahrscheinlich.
  • Website-Ersteller wie Elementor bieten ein Modul, mit dem Sie WordPress-Anker-Einweglinks zu Inhalten einfügen können.
  • Es gibt Plugins, die automatisierte Anker-Hyperlinks zu Ihren Inhalten hinzufügen können, wodurch Sie etwas Einrichtungszeit sparen können.

Zunächst werden wir uns mit der Führungsmethode befassen. Auch wenn es schwierig erscheint, macht die Anwendung des Blockeditors dies sehr einfach.

1. Verwenden Sie eine Führungstechnik, um eingehende Anker-Links in den Blockeditor einzufügen

Für die meisten Endbenutzer bietet der Blockeditor alles, was Sie brauchen, um eingehende WordPress-Anker-Links zu Ihren Informationen zu erhöhen. Heben Sie zunächst einen Textabschnitt hervor, dem Sie einen Website-Link hinzufügen möchten, so wie Sie es mit einem Hyperlink tun würden:

Auswählen von Text auf der Seite, der als Hyperlink verwendet werden soll.

Als nächstes wandeln Sie dies in einen Website-Link um, indem Sie die entsprechende Auswahl treffen, und fügen Sie Ihr Anker-Tag ein, dem ein Octothorpe vorangestellt ist:

Hinzufügen eines Ankerlinks zu Text mit einem Octothorpe.

Sie werden wissen, ob Sie dies richtig verstanden haben, da neben dem Backlink das Wort „Intern“ angezeigt wird. Sobald Sie dies beibehalten haben, gehen Sie zu dem Abschnitt Ihres geschriebenen Inhalts, auf den Sie den Anker setzen möchten. Wir wollen eine Überschrift verwenden.

Sie sollten zum Teil Block > Hoch entwickelt in der Seitenleiste der idealen Hand gehen und ihn erweitern. Dort sehen Sie die HTML-Anchor- Disziplin:

Hinzufügen einer ID zum HTML-Ankerfeld im Blockeditor.

Fügen Sie hier den Text Ihrer WordPress-Anker-URL ohne das Oktothorpe ein. Das ist alles, was Sie tun müssen, und wenn Sie sich die Live-Vorschau ansehen, werden Sie sehen, dass der Link zur Anker-Website funktioniert.

Fügen Sie dem Vintage-Editor Anker-Back-Links hinzu

Die Methode für den Typical-Editor ist eine Art Hybrid zwischen der vollständig manuellen HTML-Lösung und der des Block-Editors. Als erstes fügen Sie den Hyperlink zu Ihrem Material nur auf der sichtbaren Seite ein…

Hinzufügen eines HTML-Ankers zu Text im klassischen Editor.

…dann wechselst du zum Textuellen Inhaltseditor und fügst den Anker zu deinem idealen Faktor hinzu:

Verwenden des Texteditors zum Hinzufügen einer Ankerlink-ID.

Wenn Sie wieder zum sichtbaren Editor wechseln, sehen Sie den eingefügten Backlink, aber er funktioniert möglicherweise nicht so, wie Sie es beabsichtigen, bis Sie eine Vorschau Ihres Artikels anzeigen.

2. Fügen Sie Anker-Backlinks ein. Verwenden Sie ein Site Builder-Plugin

Die meisten Page Builder-Plugins wie Elementor oder Beaver Builder bieten Module zum Einfügen von Anker-Hyperlinks in Ihre Inhalte. Diese können genauso vielseitig sein wie HTML, vor allem, weil sie überall dort eingesetzt werden können, wo andere Module hinkommen.

In Elementor verwenden Sie beispielsweise das Element Menu Anchor:

Elementors Menü-Ankerelement.

Um dies zu verwenden, ziehen Sie es an Ihre ausgewählte Position. Wir empfehlen Ihnen, es vor allen Kursaspekten oder zumindest vor dem Bereich zu platzieren, in dem Sie ankern müssen.

Hinzufügen einer ID zum Menüanker in Elementor.

Wenn Sie beim Speichern Ihrer Variationen helfen, können Sie die Anker-URL überprüfen. Einzigartige Website-Ersteller verwenden eine Vielzahl von Ansätzen, um WordPress-Anker-Hyperlinks einzufügen, und Sie werden auch verschiedene Implementierungen am Frontend finden. Trotzdem ist das Konzept genau das Richtige, und Sie erhalten auch die genauen endgültigen Vorteile.

3. Verwenden Sie ein Plugin, um automatische Anker-Backlinks zu Ihrer Website zu integrieren

Wenn Sie Ihrer Webseite weitaus mehr Leistung verleihen und Ihren WordPress-Anker-Backlinks zum Leuchten verhelfen möchten, können Sie ein Inhaltsverzeichnis (ToC)-Plugin verwenden. Es gibt eine Reihe zugänglicher, aber die meisten haben keine Bewertungen für die neuesten WordPress-Versionen oder haben nie häufige Updates. Trotzdem kreuzt das SimpleTOC-Plugin alle entsprechenden Container an:

Das SimpleTOC-Plugin.

Natürlich müssen Sie das Plugin wie gewohnt einrichten und aktivieren und dann zum Block-Editor gehen. Bewahren Sie anschließend Ihre Artikel auf und suchen Sie dann nach dem SimpleTOC-Block:

Den SimpleTOC-Block in WordPress finden.

Nachdem Sie dies zu Ihrer Veröffentlichung hinzugefügt haben, werden sofort die Links für alle Überschriften in Ihren Artikeln übernommen. Das Inhaltsverzeichnis zeigt einzelne Überschriften an und Sie müssen keine Leitfäden markieren.

Die Generierung eines Inhaltsverzeichnisses durch das SimpleTOC-Plugin.

Trotzdem könnten Sie einige Überschriften aus Ihrem Inhaltsverzeichnis einschränken, wenn Sie möchten. Wenn Sie den simpletoc-concealed CSS-Kurs auf die Branche der weiteren CSS-Klasse(n) eines Überschriftenblocks erweitern, wird dies vor Ihrem Inhaltsverzeichnis verborgen. Sie finden diese Disziplin an ähnlicher Stelle wie die HTML-Anchor-Disziplin: In der Seitenleiste Block > Innovativ :

Das Feld Zusätzliche CSS-Klasse(n) im Blockeditor.

Es ist eine sehr einfache Implementierung, die möglicherweise nicht den genauen Grad an Gesamtflexibilität wie manuelle Verfahren hat, aber sie ist schnell und ermöglicht es Ihnen, WordPress-Anker-Hyperlinks auf normale Weise ohne großen Aufwand zu verwenden.

Zusammenfassend

Die Begegnung des Benutzers ist von größter Bedeutung, und da dies der Fall ist, sollten Sie an alle Methoden denken, mit denen Sie ihre Zeit mit Website-Problemen verbringen können. Eingehende WordPress-Anker-Links können dies erreichen. Sie helfen Ihnen dabei, eine Inline-Inhaltsnavigation zu erstellen, und im Gegenzug hilft dies Ihren Käufern, ohne viel Aufhebens oder Verzögerungen zu den schriftlichen Inhalten zu scrollen, die sie benötigen.

Dieser Beitrag ist bei einigen Strategien zum Einbinden von WordPress-Ankerlinks in Ihre Website erschienen. Hier ist eine kurze Zusammenfassung:

  • Sie können sie als Teil von HTML-Tags auf jeder Website integrieren, nicht nur in WordPress.
  • Mit dem Blockeditor können Sie Anker genau so einbauen, wie Sie Hyperlinks erhöhen würden.
  • Website-Ersteller wie Elementor verfügen normalerweise über fokussierte Module, mit denen Sie Anker in Ihr Material integrieren können.
  • Ein Plugin wie SimpleTOC kann automatische WordPress-Ankerlinks zu Ihrem Material einbauen. In einigen Fällen aktualisiert ein Plug-in sein Inhaltsverzeichnis, damit es mit den Überschriften Ihres Beitrags übereinstimmt.

Glauben Sie, dass WordPress-Ankerlinks Ihrem SEO und Ihren Zuschauern zugute kommen, und wenn nicht, was hilft ihnen, sich zu engagieren? Lassen Sie es uns im Antwortteil unten wissen!