WordPress: alle Links unterstreichen

Tipp: Du willst deine Website mit Social-Media-Netzwerken verknüpfen, um Besucher von Facebook, Twitter, Instagram, YouTube, Pinterest, Google Plus, Snapchat und Whatsapp auf WordPress zu ziehen? Dann spare dir Zeit und Nerven und schnapp dir das Buch Freunde, Fans und Follower.

Du möchtest alle Links in WordPress unterstreichen? Das geht mit CSS – aber nicht direkt im Stylesheet, dann würtde deine Änderung mit einem Theme-Update überschrieben. In aktuellen WordPress-Versionen funktioniert die CSS-Bearbeitung via Design > Customizer.  Nutze dann die CSS-Box, unten bei Zusätzliches CSS:
CSS im Customizer

Kopiere dir diesen Code in die CSS-Box

a,a:link,a:visited,a:hover {
text-decoration:underline!important
}

Nur noch mit veralteten WordPress-Versionen – was ziemlich bedenklich ist – benötigst du ein externernes Plugin wie Super Simple Custom CSS Setting. Ich empfehle es nicht mehr, und verlinke es deshalb auch nicht.

Custom CSS Settings

Die Custom CSS Settings: Alle Links werden unterstrichen.


Gib den Code ein und klicke auf Submit Query. Fertig. Alle Links sind unterstrichen.

PS: Um die Aktion rückgängig zu machen, lösche den Code aus der Box und klicke nochmal auf Submit Query.

4 Gedanken zu „WordPress: alle Links unterstreichen

  1. Danke für die Kurzanleitung, aber… habe das umgekehrte Problem, meine Links sollen standartmäßig ohne Unterstreichung erscheinen, höchstens mit der Maus darüber unterstrichen…

    • Mit Hover-Effekt unterstrichen, ansonsten nicht? Funktioniert aufgedröselt so:

      a:link { text-decoration: none; }
      a:visited { text-decoration: none; }
      a:hover { text-decoration: underline; }
      a:active { text-decoration: none; }
      Erklärung
      link = Normalzustand eines Links
      visited = bereits besuchter Link
      hover = Link beim Drüberfahren mit der Maus
      actice = Zustand, wenn gerade auf den Link geklickt wird

      CSS-Codeschnipsel zum Einfügen:
      a:hover {
      text-decoration:underline!important
      }

      a:link,a:visited,a:active {
      text-decoration:none
      }

      PS: das !important bewirkt, dass die Anweisung auf jeden Fall durchgeführt wird, auch wenn irgendwo in der CSS-Datei etwas anderes steht.

Kommentar verfassen