So ändern Sie die Schriftgröße in WordPress mit JavaScript

Haben Sie jemals eine Website oder ein Blog gefunden, auf der die Besucher die Schriftgröße über eine +/- Taste in der Seitenleiste ändern können? Normalerweise sollten Sie diese Funktion niemals hinzufügen müssen, da alle gängigen Browser über die Schaltflächen zum Vergrößern / Verkleinern verfügen. Es gibt jedoch immer noch viele Benutzer, die mit dieser Zoom-Funktion nicht vertraut sind. In diesem Artikel zeigen wir Ihnen, wie Sie Benutzern die Möglichkeit geben, die Schriftgröße in WordPress mithilfe einer einfachen JavaScript-Funktion und etwas HTML zu ändern.

Zuerst können Sie dieses Skript in Ihre Kopf- oder Fußzeile einfügen:

function resizeText (multiplier) if (document.body.style.fontSize == "") document.body.style.fontSize = "1.0em";  document.body.style.fontSize = parseFloat (document.body.style.fontSize) + (Multiplikator * 0,2) + "em"; 

Fügen Sie diesen Code dann einfach an einer beliebigen Stelle in Ihr Design ein (die meisten Benutzer setzen ihn in die Seitenleiste).

 Text größer machen Text verkleinern 

Sie können auch Bilder wie +/- Symbole oder andere verwenden, wenn Sie möchten. Damit all dies möglich ist, müssen Sie die Schriftgröße für Ihr HTML-Element angeben.

Wenn Sie den Bereich einschränken möchten, in dem die Schriftgröße eingeschlossen werden soll (z. B. nur Ihr Inhaltsbereich), ändern Sie das ursprüngliche Javascript in etwa wie folgt:

 var c = document.getElementById ("Inhalt"); function resizeText (multiplier) if (c.style.fontSize == "") c.style.fontSize = "1.0em";  c.style.fontSize = parseFloat (c.style.fontSize) + (Multiplikator * 0,2) + "em";  

Das bedeutet, dass Sie nur die Schriftgröße in dem Element ändern, das die ID = "Inhalt" hat..

Suchen Sie nach einem Live-Beispiel? Besuchen Sie den Blog von Eric Wendelin.

Quelle: David Walsh