Willkommen beim WP Wegerl.at 'Lesemodus'!
Entspanntes Lesen und spannende Artikel warten auf dich.
Entdecke unsere besten Beiträge und genieße den Lesemodus.
smilies.4-user.de

Font-Resize, Schriftgröße auf der Website

Info echo
OpenClipart-Vectors-katze-1

Ist der Classic-Editor schon zu kennen? –
"Advanced Editor Tools – ist so klasse!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-2

Anklickt Classic-Editor mit Advanced Editor Tools
"Advanced Editor Tools – ist das ausgezeichnete!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-3

Klassischen Editor anwenden! – und …
"Advanced Editor Tools – ist so sehr gut !"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-7

… die Welt gehört dem, der sie genießt.
"Advanced Editor Tools – und tut sehr gut!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-4

Advanced Editor Tools aktive Installationen: 2+ Millionen
"Advanced Editor Tools – ist so fabelhaft!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-5

Ansprechend! – so gehts hier zur Lancierung
"Advanced Editor Tools – ist de luxe!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-6

… und NEU! – Classic Widgets
"Classic Widgets – sind so grandiose!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Info echo
OpenClipart-Vectors-katze-8a

Werkraum ist Werkraum und Frontend ist Frontend
Katzen SVG OpenClipart-Vectors; Ticker von Ditty News Ticker
"Advanced Editor Tools – ist so fein!"
Anklickt! – Advanced Editor Tools; und NEU! – Classic Widgets

Beitrag in Arbeit!

#content p
#content strong
#content b
#content ol
#content ul
#content dl
#content td
pre
code
pre code

#content h2
#content h3
#content h4
#content h5
#content h6

.readermode p

Mit Tool ist der WordPress Website ein größeres oder auch kleineres Schriftbild möglich. Font-Resize, das ist für individuelle Schriftgröße von Website. Die Beschreibung trägt auch bei zur Verständlichkeit des Schriftzuschnitts.

Im Zusammenhang zum Schriftzuschnitt, siehe die Auswirkung auf die Schrift, Font-Resizer und Schriftzuschnitt

Passend zur Lesefreundlichkeit ist auch auf Lesemodus hinzuweisen, siehe hier im Titel Sic Lesemodus von Website! – das ist ganz praktisch mal


Das Plug-in Accessibility Font Resizer. Warum hier das Plug-in und nicht Zeno Font Resizer?

Das "Accessibility Font Resizer" Plug-in wird hier der Website bevorzugt, da es sich besser ins Header-Menü integriert und der anderseits angebotene Shortcode zur Abbildung der Schriftgröße für Zeno ist hierfür nicht geeignet. Hingegen ist mit Accessibility die Abbildung zur Schriftgröße vornehmlich durch ein Menü über die Classen zu erstellen und daher für diesen Zweck viel besser geeignet.

Das Zeno Plug-in hat auch ein Widget und die Einstellungen zur Schriftanpassung sind etwas unterschiedlich. Jedoch ist beiden darauf zu achten, welche Elemente der Website thematisiert werden sollen. In den Einstellungen gibt es die Option, ob die Schriftanpassung nur den Contentbereich ansprechen soll oder auch andere Bereiche der Website, wie z.B. der Seitenleisten <body>. Im Speziellen geht es um die Handhabung von CSS-Elementen, um sicherzustellen, dass nur der Text im Inhaltsbereich oder auch die gesamte Website von der Schriftanpassung angesprochen ist. Diese Feinabstimmung kann für Anfänger von WordPress schwierig sein, daher ist hier eine Empfehlung.

Zum Beispiel mit Plug-in Accessibility hier der Website soll nur der Contentbereich, das ist der Bereich, der nur dem Inhalt von einem Beitrag ist, der Schriftgröße einzustellen sein. Somit ist das der Inhalt dem ID-Selektor #content p und diversen anderen HTML-Elementen. Einfacher funktioniert da Zeno, da wird der Einstellung 'Größe des gesamten Inhalts im Body-Element ändern (<body>Gesamter Inhalt Ihrer Website</body>)' meist das richtige sein.

So ist hier der Website mit Plug-in Accessibility da bei HTML elements:

#content p
#content strong
#content b
#content ol
#content ul
#content dl
#content td
pre
code

#content h2
#content h3
#content h4
#content h5
#content h6

.readermode p

 

Siehe https://wordpress.org/support/topic/how-to-use-this-plugin-69/

Ans Herz zulegen ist nochmalig das Video https://www.berrycast.com/conversations/bc2b832e-30b0-54f4-8f48-bf270acf07f3

Individuelle Schriftgröße

Font resize

Font resize – Schriftgröße

Plug-in als Tool zur individuellen Größendarstellung der Schrift direkt auf Website.

font-resitzer

Zeno Font Resizer

So Plug-ins wie "Accessibility Font Resizer" oder "Zeno Font Resitzer" formatieren den Text und so die unterschiedliche Größendarstellung bewerkstelligen. Über den mittleren Buchstaben AAA erfolgt der Reset zur normale Schriftgröße. Im Unterschied zum Plugin "Zeno Font Resizer" hat das Plugin "font-resitzer" eine Limitierung der Schriftgrößen. – Die Plug-ins sind mit einem Widget (Dashboard/Design/Widget) vertreten. In Anwendung von Cookies wird die jeweilige Schriftgröße der weiteren besuchten Seiten selbiger Website weitergegeben.

font-resizer

Einstellung "font-resizer":

Screenshot

Grundeinstellungen
  • Grundeinstellung, die Größe gesamten Inhalt im Body-Tag (<body> Alle Inhalte Ihrer Website </ body>)
  • Verwenden div mit id Innenkörper (<div id = "innere Körper"> Resizable Text </ div>).
  • Verwenden Sie Ihre eigenen div id (<div id = "yourid"> Resizable Text </ div>).
  • Verwenden Sie Ihre eigenen Elemente (Zum Beispiel: eine Spanne mit Klasse "bla" (<span class = "bla"> Resizable Text </ span>), geben Sie die CSS-Definition "span.bla" (ohne Anführungszeichen).

Zeno F. R.

Einstellung "Zeno Font Resizer"

Grundeinstellungen

  • Standard-Einstellung, die Größe gesamten Inhalt in HTML-Element <html> Alle Inhalte der Website </ html>)
  • Ändern Sie die Größe gesamten Inhalt in Körperelement <body> Alle Inhalte Ihrer Website </ body>.
  • Verwenden div mit id Innenkörpers (<div id = "Innenkörper"> Resizable Text </ div>).
  • Verwenden Sie Ihre eigenen div id (<div id = "yourid"> Resizable Text </ div>).
  • Verwenden Sie Ihre eigenen Elemente (Zum Beispiel: eine Spanne mit Klasse "bla" (<span class = "bla"> Resizable Text </ span>), geben Sie die CSS-Definition "span.bla" (ohne Anführungszeichen)).

Fortsetzung, die Auswirkung auf die Schrift, Font-Resizer und Schriftzuschnitt


Aktualisiert im Jahr 2023-April