Silbentrennung in WordPress einrichten

Spätestens, wenn du deine erstellte Webseite mobil anschaust, siehst du, wenn das ein oder andere nicht optimal auf dem Bildschirm dargestellt wird.

Silbentrennung in WordPress nicht vorhanden

Dann kann die Überschrift gleich mal so aussehen: Einzelne Buchstaben werden in einer neuen Zeile angezeigt, ohne das Trennzeichen.

Zwei schnelle Möglichkeiten, um die Silbentrennung in WordPress einzurichten

1. 1. Mit dem CSS-Code. In DIVI bindest du den folgenden Code-Schnipsel in DIVI > Theme-Optionen > Eigene CSS ein. Wenn du kein DIVI hast, kannst du das meist auch über den Theme Customizer > CSS einfügen. Aber Achtung, wenn du nicht mit einem Child-Theme arbeitest, insbesondere, wenn du kein DIVI verwendest, kann nach einem Update die Änderung mithilfe des CSS weg sein.

      /**
       * Silbentrennung auf deiner Website
       * https://wp-bibel.de/tutorial/silbentrennung-auf-deiner-website/
       */
      
      body {
          -ms-hyphens: auto;
          -webkit-hyphens: auto;
          hyphens: auto;
      }

      Wie du schon anhand des Kommentars in diesem Code-Schnipsel siehst (Kommentar => /** …. */), ist der CSS-Code von https://wp-bibel.de. Danke dafür!
      Es kann sein, dass ältere Browser diesen CSS-Code noch nicht verstehen. Im schlimmsten Fall hat der Code dann keinerlei Auswirkungen auf das lange Wort. Bitte überprüfe auch die Sprache, die in deinem WordPress unter Einstellungen > Sprache der Webseite eingestellt wurde. Wenn an dieser Stelle nicht die korrekte Sprache eingestellt wurde, kann die korrekte Silbentrennung möglicherweise nicht funktionieren.

   2. Du verwendest ein Plugin wp-Typography, welches ich selbst noch nicht ausgetestet habe, aber an einigen Stellen einen Verweis zu diesem Plugin gesehen habe. Du weißt, so wenig „fancy“ Plugins wie möglich ist die Devise, damit deine Webseite nicht unnötig verlangsamt wird.

Die Silbentrennung in WordPress ist nun aktiv

Die Worte werden nun nach dem jeweiligen Sprachschema getrennt.