Wie man die Linkfarbe in WordPress ändert (Anleitung für Anfänger)

Möchten Sie lernen, wie Sie die Linkfarbe in WordPress ändern können?

Das Ändern der Linkfarbe gibt Ihnen mehr Kontrolle über das Design Ihrer Website und kann die Navigation für Ihre Besucher erleichtern.

In diesem Artikel zeigen wir Ihnen Schritt für Schritt, wie Sie die Linkfarbe in WordPress ändern können.

Warum sollte man die Linkfarbe in WordPress ändern?

Wenn Sie einen Link in WordPress hinzufügen, bestimmt Ihr Theme automatisch die Farbe des Links.

Manchmal sind die Standard-Farboptionen Ihres WordPress-Themes genau das, was Sie wollen, aber manchmal möchten Sie mehr Kontrolle darüber haben, wie die Links aussehen.

Sie könnten zum Beispiel die Farbe Ihrer Links ändern wollen, um sie an die Marke oder das Logo Ihres Unternehmens anzupassen. Oder Sie möchten den Farbkontrast erhöhen, um die Webzugänglichkeit für Leser mit eingeschränktem Sehvermögen zu verbessern.

Bei einigen Themes können Sie die Farbe der Links direkt in den Theme-Optionen oder im WordPress-Theme-Customizer ändern. Schauen Sie also unbedingt in der Dokumentation Ihres Themes nach, bevor Sie die Farbe der Links mit CSS ändern.

Schauen wir uns nun einige Möglichkeiten an, wie Sie die Linkfarbe auf Ihrer WordPress-Website ändern können.

Methode 1. Ändern der Linkfarbe in WordPress durch Bearbeiten von CSS

Eine Möglichkeit, die Linkfarbe in WordPress zu ändern, besteht darin, benutzerdefinierten CSS-Code hinzuzufügen.

Als Erstes müssen Sie zu Ihrem WordPress-Administrations-Dashboard navigieren und zu Darstellung “ Anpassen gehen und dann auf die Menüoption „Zusätzliches CSS“ klicken.

Dies bringt Sie zu einem Bildschirm, auf dem Sie Ihren benutzerdefinierten CSS-Code auf der linken Seite der Seite hinzufügen können.

In diesen Bereich des Editors fügen Sie die CSS-Codefragmente aus den folgenden Beispielen ein.

Zunächst werden wir die allgemeine Linkfarbe anpassen. Dies ist die Farbe, die Ihre Besucher sehen werden, wenn sie noch nie auf den Link geklickt haben.

Sie können den CSS-Code unten als Beispiel verwenden.

a {
     farbe: #FFA500;
}

Dadurch wird die Standardfarbe des Links in Orange geändert. Stellen Sie sicher, dass Sie die Farbe #FFA500 in die von Ihnen gewünschte Farbe ändern.

Ändern der Link-Hover-Farbe in WordPress

Als Nächstes werden wir die Farbe des Link-Hovers ändern. Wenn ein Benutzer mit dem Mauszeiger über einen Link fährt, ändert sich die Farbe, um seine Aufmerksamkeit zu erregen.

Sie können den folgenden CSS-Code als Beispiel verwenden.

a:hover {
     color: #FF0000;
     text-decoration: underline;
}

Der obige Code ändert die Farbe des Links in Rot und unterstreicht den Text, wenn Besucher mit dem Mauszeiger darüber fahren. Stellen Sie sicher, dass Sie die Farbe #FF0000 in die von Ihnen bevorzugte Farbe ändern.

Wir verwenden den Link-Unterstreichungs-Hover-Effekt hier bei WPBeginner für unsere Links.

Ändern Sie die Linkfarbe nach dem Besuch in WordPress

Eine weitere Sache, die Sie vielleicht ändern möchten, ist die Linkfarbe, nachdem ein Benutzer auf einen Link geklickt hat. Dies kann Besuchern helfen, sich in Ihrem WordPress-Blog leicht zurechtzufinden und zu sehen, auf welche Links sie bereits geklickt haben.

Sie können den folgenden CSS-Code verwenden, um die Farbe des besuchten Links zu ändern.

a:visited {
     color: #0000FF;
}

Stellen Sie sicher, dass Sie die blaue Farbe #0000FF in eine Farbe Ihrer Wahl ändern.

Hier sehen Sie, wie der gesamte obige CSS-Code im WordPress Customizer aussehen wird.

Sobald Sie Ihre Änderungen vorgenommen haben, klicken Sie auf die Schaltfläche „Veröffentlichen“, um die Änderungen zu aktivieren.

Der obige CSS-Code wird die Farbe aller Links auf Ihrer Website ändern.

Wenn Sie nur die Links in Ihren Beiträgen und Seiten anpassen möchten, können Sie das folgende Codebeispiel verwenden.

.entry-content a {
     farbe: #FFA500;
}

.entry-content a:hover {
     color: #FF0000;
     text-decoration: underline;
}

.entry-content a:visited {
     color: #0000FF;
}

Dieser Code bewirkt dasselbe wie die obigen Codebeispiele, aber .entry-content zielt nur auf Links innerhalb Ihres Inhalts ab.

Ändern Sie die Farbe Ihrer Navigationslinks in WordPress

Ein letzter Link-Stil, den Sie ebenfalls anpassen können, sind Ihre Navigationsmenü-Links.

Weitere Details finden Sie in unserem Leitfaden zur Gestaltung von WordPress-Navigationsmenüs.

Wenn Sie keinen Code direkt in Ihr WordPress-Theme einfügen möchten, können Sie ein CSS-Plugin verwenden, um Code zu Ihrer Website hinzuzufügen.

Auf diese Weise werden Ihre CSS-Änderungen auch dann übernommen, wenn Sie sich entscheiden, Ihr WordPress-Theme zu ändern.

Als Erstes müssen Sie das Simple Custom CSS and JS Plugin installieren und aktivieren. Weitere Einzelheiten finden Sie in unserer Schritt-für-Schritt-Anleitung für die Installation eines WordPress-Plugins.

Nach der Aktivierung gehen Sie einfach zu Custom CSS & JS “ Add Custom CSS in Ihrem WordPress-Admin-Panel.

Hier können Sie denselben CSS-Code wie oben hinzufügen.

Sobald Sie den Code hinzugefügt haben, klicken Sie auf die Schaltfläche „Veröffentlichen“ oder „Aktualisieren“.

Methode 2. Ändern Sie die Linkfarbe ohne CSS-Bearbeitung

Wenn Sie mit der Bearbeitung von CSS-Dateien nicht vertraut sind, ist diese Methode für Sie geeignet.

Anstatt CSS-Code direkt auf Ihrer Website hinzuzufügen, können Sie ein CSS-Styling-Plugin verwenden, um Ihre Website visuell zu bearbeiten, ohne Code zu schreiben.

Wir empfehlen die Verwendung des CSS Hero-Plugins. Es ist sehr einsteigerfreundlich und ermöglicht Ihnen die visuelle Anpassung Ihrer Website ähnlich wie ein Drag-and-Drop-Seitenerstellungsprogramm.

Sobald das Plugin installiert ist, müssen Sie auf die Schaltfläche „Weiter zur Produktaktivierung“ oberhalb der Liste der Plugins klicken, um es zu aktivieren und Ihr Konto zu verbinden.

Daraufhin wird ein Bildschirm angezeigt, in den Sie Ihren Benutzernamen und Ihr Passwort eingeben können.

Sie müssen nur den Anweisungen auf dem Bildschirm folgen und werden nach der Verifizierung Ihres Kontos zu Ihrer Website zurückgebracht.

Klicken Sie anschließend auf die Schaltfläche „Anpassen mit CSS Hero“ oben in der Symbolleiste Ihrer WordPress-Verwaltung.

Dadurch wird Ihre Website geöffnet, auf der CSS Hero läuft. CSS Hero verwendet einen sogenannten „What You See is What You Get“-Editor (WYSIWYG).

Klicken Sie einfach auf ein beliebiges Element der Seite, und es wird eine Symbolleiste angezeigt, mit der Sie Anpassungen vornehmen können.

Klicken Sie dann auf einen der Links auf Ihrer Website. Wir beginnen mit einem der Blogpost-Links.

Wählen Sie dann den Menüpunkt „Typografie“ und wählen Sie eine neue Farbe für Ihren Link.

Sie können eine neue Farbe aus der Liste auswählen oder Ihren eigenen Farbcode hinzufügen.

Ändern Sie die Farbe Ihres WordPress-Navigationsmenüs

Als nächstes können Sie die Farbe der Links in Ihrem WordPress-Navigationsmenü ändern.

Bewegen Sie einfach den Mauszeiger über Ihr Navigationsmenü und klicken Sie auf einen der Menüpunkte.

Wählen Sie dann die Option „Typografie“ und Sie können die Farbe direkt darunter anpassen.

Wenn Sie die Farbe des Menülinks ändern, werden Sie feststellen, dass die Änderungen sofort in der Vorschau angezeigt werden.

Sobald Sie die Linkfarben geändert haben, müssen Sie auf die Schaltfläche „Speichern und veröffentlichen“ klicken, um die Änderungen zu aktivieren.

Wir hoffen, dass dieser Artikel Ihnen geholfen hat zu lernen, wie man die Linkfarbe in WordPress ändert.