{"id":1049203,"date":"2022-05-31T11:14:17","date_gmt":"2022-05-31T11:14:17","guid":{"rendered":"https:\/\/rankmath.com\/?p=1049203"},"modified":"2025-09-04T02:37:10","modified_gmt":"2025-09-04T02:37:10","slug":"change-the-font-size-in-wordpress","status":"publish","type":"post","link":"https:\/\/rankmath.com\/de\/blog\/change-the-font-size-in-wordpress\/","title":{"rendered":"So \u00e4ndern Sie schnell die Schriftgr\u00f6\u00dfe in WordPress"},"content":{"rendered":"<p>When you\u2019re working on your WordPress site, sometimes the default font size just doesn\u2019t cut it. Maybe your text looks too small on a desktop, or maybe you want headings that really stand out.<\/p>\n\n\n\n<p>The good news? <\/p>\n\n\n\n<p>WordPress provides several simple ways to adjust your font size, ensuring your content is easy to read and suits your style.<\/p>\n\n\n\n<p>In this post, I\u2019ll walk you through quick methods you can use to change the font size in WordPress. So, without any further ado, let&#8217;s get started.<\/p>\n\n\n\n<!--more-->\n\n\n\n<div id=\"toc\">\n    <h2>Inhaltsverzeichnis<\/h2>\n    <ol>\n        <li><a href=\"#change-font\">Why You Should Change the Font in WordPress?<\/a><\/li>\n        <li><a href=\"#how\">How to Change the Font Size in WordPress<\/a>\n            <ul>\n                <li><a href=\"#headings\">Verwendung der \u00dcberschriften<\/a><\/li>\n                <li><a href=\"#plugin\">Using a Plugin<\/a><\/li>\n                <li><a href=\"#full-site-editor\">Using Full-Site Editor<\/a><\/li>\n                <li><a href=\"#css-code\">Verwenden des CSS-Codes<\/a><\/li>\n            <\/ul>\n        <\/li>\n        <li><a href=\"#conclusion\">Fazit<\/a><\/li>\n    <\/ol>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"change-font\"><span class=\"number\">1<\/span>  Why You Should Change the Font in WordPress?<\/h2>\n\n\n\n<p>When you change the font on your WordPress site, you\u2019re not just switching up the design; you\u2019re shaping how visitors experience your content. The right font size and style can <strong>make your text easier to read, highlight important points, and reflect your brand\u2019s personality.<\/strong><\/p>\n\n\n\n<p>Think about it: a font that looks perfect on your desktop might feel too small or cramped on a mobile screen. If visitors struggle to read your content, they\u2019re less likely to stick around. <\/p>\n\n\n\n<p>On the flip side, a clean, well-sized font <strong>keeps readers engaged and encourages them <\/strong>to explore more of your site.<\/p>\n\n\n\n<p>Changing your font can also <strong>improve your <a href=\"https:\/\/rankmath.com\/blog\/quick-seo-wins\/\">SEO<\/a>. <\/strong>A clear content structure, supported by readable fonts and headings, helps search engines understand your pages, especially if you publish long-form content. That means better chances of ranking higher and reaching the right audience.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"how\"><span class=\"number\">2<\/span>  How to Change the Font Size in WordPress<\/h2>\n\n\n\n<p>Now that you know why font size matters, let\u2019s look at how you can change it in WordPress. Before you begin with any of the below methods, check your active theme settings to change the font size. Many modern WordPress themes come with built-in typography options that let you change font sizes, line height, and even font families directly from the Customizer.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"headings\"><span class=\"number\">2.1<\/span>  Verwendung der \u00dcberschriften<\/h3>\n\n\n\n<p>One of the quickest ways to adjust font size is by using headings. Headings automatically appear larger than regular text in most WordPress themes, so they\u2019re perfect for grabbing attention. They also break your content into sections, making it easier for readers to scan and understand.<\/p>\n\n\n\n<p>On top of that, headings improve your SEO. Search engines use them to understand your content structure, which helps your pages rank better, especially if you publish longer posts. <\/p>\n\n\n\n<p>By using headings wisely, you\u2019re not only improving readability but also boosting your chances of showing up higher in search results.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Schriftstile im Blockeditor \u00e4ndern (Gutenberg)<\/h4>\n\n\n\n<p>Um die Schriftgr\u00f6\u00dfe im Gutenberg-Editor zu \u00e4ndern, navigiere zu deinem Beitrag oder deiner Seite. <\/p>\n\n\n\n<p>\u00dcberschrift 2 ist die Standardeinstellung f\u00fcr den Block. Wenn Sie dies \u00e4ndern m\u00f6chten, w\u00e4hlen Sie eine neue Gr\u00f6\u00dfe aus dem Dropdown-Men\u00fc \u201eH2\u201c.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1055\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/heading-ex-scaled.jpg\" alt=\"Set Heading\" class=\"wp-image-1595058\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Sie k\u00f6nnen die Gr\u00f6\u00dfe und Farbe auch in den Blockeinstellungen auf der rechten Seite des Bildschirms anpassen.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1055\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/set-color-scaled.jpg\" alt=\"\u00dcberschriftenblock\" class=\"wp-image-1595060\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Once you&#8217;ve made the necessary changes, save\/publish the post.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Schriftstile im Classic Editor \u00e4ndern<\/h4>\n\n\n\n<p>If you\u2019re using the WordPress Classic Editor, changing font styles is quick and easy.<\/p>\n\n\n\n<p>To do so, navigate to the post or page you want to edit. Highlight the text you\u2019d like to turn into a heading.<\/p>\n\n\n\n<p>In the toolbar, click the <strong>Absatz<\/strong> dropdown menu. Choose the heading level (H1, H2, H3, etc.) that fits your content.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1070\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/classic-editor-font-scaled.jpg\" alt=\"Klassische Editor-\u00dcberschrift\" class=\"wp-image-1595069\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Once you apply the heading style, your text will appear larger and more structured. Don\u2019t forget to click <strong>Aktualisieren<\/strong> oder <strong>Ver\u00f6ffentlichen<\/strong> um Ihre \u00c4nderungen zu speichern.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"plugin\"><span class=\"number\">2.2<\/span>  Using a Plugin<\/h3>\n\n\n\n<p>If you want more control over font sizes and text formatting, the <strong><a href=\"https:\/\/wordpress.org\/plugins\/tinymce-advanced\/\" target=\"_blank\" rel=\"noopener\">Erweiterte Editor-Tools<\/a> <\/strong>plugin (formerly TinyMCE Advanced) is a great option. It gives you extra flexibility beyond the default WordPress editor, letting you adjust font sizes, styles, and more. Refer to our dedicated tutorial on <a href=\"https:\/\/rankmath.com\/blog\/how-to-install-wordpress-plugin\/\">installing plugins<\/a> in WordPress.<\/p>\n\n\n\n<p>Nach der Installation f\u00fcgt das Plugin a <strong>Klassischer Absatz<\/strong> Block zum Gutenberg-Editor. Um das Plugin zum \u00c4ndern der Schriftgr\u00f6\u00dfen in WordPress zu verwenden, m\u00fcssen Sie es installieren und aktivieren. <\/p>\n\n\n\n<p>Navigieren Sie dazu zu <strong>Plugins<\/strong> Seite des WordPress-Admin-Dashboards. Suchen Sie in der verf\u00fcgbaren Suchleiste nach dem Plugin, installieren und aktivieren Sie es.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"862\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/advanced-editor-tools-scaled.jpg\" alt=\"Installieren und aktivieren Sie Advanced Editor Tools\" class=\"wp-image-1595062\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Navigieren Sie zu <strong>Settings \u2192 Advanced Editor Tool<\/strong> (TinyMCE Advanced) to configure the editor settings. This is where you may customize the TinyMCE Advanced toolbar with the buttons you want to use.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2543\" height=\"888\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2022\/04\/advanced-editor-tool-settings.jpg\" alt=\"Erweiterte Editor-Tool-Einstellungen\" class=\"wp-image-1049832\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Next, navigate to your post or page. Now, search the <strong>Klassischer Absatz<\/strong> Block. Es wird automatisch hinzugef\u00fcgt, da Sie das Plugin aktiviert haben.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1017\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/classic-paragraph-scaled.jpg\" alt=\"Klassischer Absatzblock\" class=\"wp-image-1595063\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Add it to your post or page. You can now use the editor as you would if using the classic editor style and alter the font in WordPress using the tools provided.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1044\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/change-font-scaled.jpg\" alt=\"Klassischer Absatz hinzugef\u00fcgt\" class=\"wp-image-1595065\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"full-site-editor\"><span class=\"number\">2.3<\/span>  Using Full-Site Editor<\/h3>\n\n\n\n<p>To change the font size using the Full-Site Editor in WordPress, navigate to your WordPress dashboard and click <strong>Aussehen<\/strong> \u2192 <strong>Editor<\/strong> to open the Full-Site Editor. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1912\" height=\"1272\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/editor.jpg\" alt=\"Navigate to Editor\" class=\"wp-image-1595078\" \/><\/figure>\n\n\n\n<p>Once inside, select the template or template part where you want to adjust the font size. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"2560\" height=\"950\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2022\/05\/select-template-scaled.jpg\" alt=\"Select Template\" class=\"wp-image-1595140\" \/><\/figure>\n\n\n\n<p>In the settings panel, locate the <strong>Typography<\/strong> section and expand it. Here, you will find the option to change the <strong>Font Size<\/strong>. You can select from predefined sizes like small, medium, large, and extra-large or enter a custom size for more precise control. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"2560\" height=\"1230\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2022\/05\/typography-scaled.jpg\" alt=\"Change font size using Full-Site Editor\" class=\"wp-image-1595146\" \/><\/figure>\n\n\n\n<p>After selecting the desired font size, review the changes in the editor preview to ensure they appear as expected.<\/p>\n\n\n\n<p>Once satisfied with the adjustments, click <strong>Speichern<\/strong> to apply the changes site-wide. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"css-code\"><span class=\"number\">2.4<\/span>  Verwenden des CSS-Codes<\/h3>\n\n\n\n<p>Using CSS to change the font size in WordPress requires adding a few lines of code, but it gives you full control over your site&#8217;s typography. With CSS, you can adjust the default paragraph size across your entire website for a consistent look. <\/p>\n\n\n\n<p>The easiest way to do this is by navigating to <strong>Appearance \u2192 Customize<\/strong> and using the <strong>Theme Customizer<\/strong>. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1606\" height=\"1130\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/customize-headings.jpeg\" alt=\"Customize settings\" class=\"wp-image-1595067\" \/><\/figure>\n\n\n\n<p>Some WordPress themes have built-in options to adjust font size, making it easy to customize text without writing any code. If your theme includes this feature, you can modify font sizes directly from the settings. However, if your theme doesn\u2019t offer this option, you can still take control by using custom CSS.<\/p>\n\n\n\n<p>Navigieren Sie dazu zu <strong>Appearance \u2192 Customize \u2192 Additional CSS<\/strong> in your WordPress dashboard. Here, you can add font size rules and instantly see the changes in the live preview. This allows you to fine-tune your website&#8217;s font exactly how you want it.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2462\" height=\"1214\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/additional-css.jpg\" alt=\"F\u00fcgen Sie zus\u00e4tzliches CSS hinzu \" class=\"wp-image-1595106\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>F\u00fcgen Sie Ihren Code in das CSS-Textfeld ein. Beispielsweise haben wir die Schriftgr\u00f6\u00dfe auf \u201e15px\u201c ge\u00e4ndert, Sie k\u00f6nnen eine andere Schriftgr\u00f6\u00dfe w\u00e4hlen.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p { Schriftgr\u00f6\u00dfe: 15px; }<\/code><\/pre>\n\n\n\n<p>Die \u00c4nderungen werden sofort in der Vorschau auf der rechten Seite des Bildschirms sichtbar. Um es live zu schalten, klicken Sie auf <strong>Ver\u00f6ffentlichen<\/strong> Schaltfl\u00e4che oben auf Ihrem Bildschirm, sobald Sie mit der Schriftgr\u00f6\u00dfe zufrieden sind.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" width=\"2560\" height=\"1417\" src=\"https:\/\/rankmath.com\/wp-content\/uploads\/2025\/09\/add-code-font-scaled.jpg\" alt=\"\u00c4ndern Sie die Schriftgr\u00f6\u00dfe mit dem CSS-Code\" class=\"wp-image-1595127\" style=\"width:900px;height:undefinedpx\" \/><\/figure>\n\n\n\n<p>Der obige Code \u00e4ndert die Schriftgr\u00f6\u00dfe nur f\u00fcr Abs\u00e4tze. Wenn Sie die Schriftgr\u00f6\u00dfe f\u00fcr alle H2-Unter\u00fcberschriften \u00e4ndern m\u00f6chten, \u00e4ndern Sie den obigen Code wie unten gezeigt.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>h2 { Schriftgr\u00f6\u00dfe: 32px; }<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"conclusion\"><span class=\"number\">3<\/span>  Fazit<\/h2>\n\n\n\n<p>Typography has a big impact on how visitors experience your website. The right font size makes your content easier to read, keeps people engaged, and gives your site a polished look.<\/p>\n\n\n\n<p>The good news is that changing font sizes in WordPress doesn\u2019t have to be complicated. If you\u2019re comfortable with CSS, you can customize your theme directly. But if you prefer a simpler approach, plugins make it quick and hassle-free.<\/p>\n\n\n\n<p>By choosing the method that works best for you, you\u2019ll improve readability, enhance user experience, and create a site that feels professional and accessible.<\/p>\n\n\n\n<p>What about you? What font sizes or design tweaks do you use to make your content stand out? Let us know by <a href=\"https:\/\/twitter.com\/rankmathseo\" target=\"_blank\" rel=\"noopener\"><strong>@rankmathseo twittern.<\/strong><\/a> \ud83d\udcac<\/p>","protected":false},"excerpt":{"rendered":"<p>When you\u2019re working on your WordPress site, sometimes the default font size just doesn\u2019t cut it. Maybe your text looks too small on a desktop, or maybe you want headings that really stand out. The good news? WordPress provides several simple ways to adjust your font size, ensuring your content is easy to read and [&hellip;]<\/p>","protected":false},"author":37,"featured_media":1379890,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[136],"tags":[],"class_list":{"0":"post-1049203","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-wp-tutorials"},"_links":{"self":[{"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/posts\/1049203","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/users\/37"}],"replies":[{"embeddable":true,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/comments?post=1049203"}],"version-history":[{"count":7,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/posts\/1049203\/revisions"}],"predecessor-version":[{"id":1595604,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/posts\/1049203\/revisions\/1595604"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/media\/1379890"}],"wp:attachment":[{"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/media?parent=1049203"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/categories?post=1049203"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rankmath.com\/de\/wp-json\/wp\/v2\/tags?post=1049203"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}