{"id":5228,"date":"2024-02-05T12:08:24","date_gmt":"2024-02-05T12:08:24","guid":{"rendered":"https:\/\/anukulsaini.com\/?p=5228"},"modified":"2024-02-05T12:08:27","modified_gmt":"2024-02-05T12:08:27","slug":"how-to-change-fonts-in-your-wordpress-theme","status":"publish","type":"post","link":"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/","title":{"rendered":"How to Change Fonts in Your WordPress Theme"},"content":{"rendered":"\n<p>Want to change the fonts on your WordPress theme?<\/p>\n\n\n\n<p>The text font on your website is a big part of how it looks and how people remember your brand. It can help people read your information better and make your site look more modern and professional.<\/p>\n\n\n\n<p>There are 5 different ways to change the font in WordPress. This post will show you the easiest way to do it without using any code or plugins.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_65 ez-toc-wrap-center counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<div class=\"ez-toc-title \" >Table of Contents<\/div>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 eztoc-toggle-hide-by-default' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Why_Change_Fonts_on_Your_WordPress_Website\" title=\"Why Change Fonts on Your WordPress Website?\">Why Change Fonts on Your WordPress Website?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Video_Guide\" title=\"Video Guide\">Video Guide<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Changing_Fonts_in_WordPress_Theme_Customizer\" title=\"Changing Fonts in WordPress Theme Customizer\">Changing Fonts in WordPress Theme Customizer<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Changing_Fonts_in_WordPress_Full_Site_Editor\" title=\"Changing Fonts in WordPress Full Site Editor\">Changing Fonts in WordPress Full Site Editor<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Change_WordPress_Fonts_Using_a_WordPress_Plugin\" title=\"Change WordPress Fonts Using a WordPress Plugin\">Change WordPress Fonts Using a WordPress Plugin<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Change_Fonts_Using_a_WordPress_Theme_Builder\" title=\"Change Fonts Using a WordPress Theme Builder\">Change Fonts Using a WordPress Theme Builder<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/#Customize_Font_Appearance_in_WordPress_Content_Editor\" title=\"Customize Font Appearance in WordPress Content Editor\">Customize Font Appearance in WordPress Content Editor<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Why_Change_Fonts_on_Your_WordPress_Website\"><\/span>Why Change Fonts on Your WordPress Website?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>When you build a website, fonts are very important. They have a big effect on how your WordPress site looks and feels.<\/p>\n\n\n\n<p>If the font on your website is hard to read, people will have a hard time staying on it, and they&#8217;ll finally leave.<\/p>\n\n\n\n<p>A font also shows what your business is all about. You can use certain fonts to make your site look more businesslike or less businesslike.<\/p>\n\n\n\n<p>The default font, font size, and font color for your website are all included in WordPress themes. You might want to change the default font, though.<\/p>\n\n\n\n<p>Still, WordPress lets you change fonts in a number of different ways. We are going to show you several ways to do it.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Video_Guide\"><\/span>Video Guide<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>This video From wpbeginner will help you. If you don&#8217;t like to read much.<\/p>\n\n\n\n<figure class=\"wp-block-embed aligncenter is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"How to Change Fonts in WordPress - 5 EASY Ways\" width=\"710\" height=\"399\" src=\"https:\/\/www.youtube.com\/embed\/jOaE5mRu-qs?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Here are written steps if you like to read.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Changing_Fonts_in_WordPress_Theme_Customizer\"><\/span>Changing Fonts in WordPress Theme Customizer<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Going to the WordPress theme customizer is a simple way to change the font on your site. It lets you change the appearance of your website and show a preview in real time.<\/p>\n\n\n\n<pre class=\"wp-block-verse\"><em><strong>Note<\/strong>: If you don't see the customizer menu choice, it means that full site editing is turned on for your theme. You'll need to find a different way to edit your site or switch themes.<\/em><\/pre>\n\n\n\n<p>We&#8217;ll use the Astra theme for this lesson. Depending on the WordPress theme you use, the options will change, though. <\/p>\n\n\n\n<p>This will depend on your theme. In the customizer, look for &#8220;<strong>font<\/strong>&#8221; or &#8220;<strong>typography<\/strong>&#8221; options.<\/p>\n\n\n\n<p>To start, go to <strong>Appearance<\/strong> \u00bb <strong>Customize<\/strong> in your WordPress panel.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"339\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-appearance-menu.png\" alt=\"Change Fonts in Your WordPress Theme\" class=\"wp-image-5409\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-appearance-menu.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-appearance-menu-300x150.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-appearance-menu-550x274.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>When you click this, the WordPress theme customizer will open.<\/p>\n\n\n\n<p>Options to change site-wide styles are available in the &#8220;<strong>Global<\/strong>&#8221; area of the Astra theme. To change the font on your entire website, go to the button on the left and select &#8220;<strong>Global<\/strong>.&#8221;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"330\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-global-settings.png\" alt=\"\" class=\"wp-image-5411\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-global-settings.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-global-settings-300x146.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-global-settings-550x267.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Options for the container, buttons, colors, and fonts are displayed on the next screen.<\/p>\n\n\n\n<p>Please click on the &#8220;<strong>Typography<\/strong>&#8221; link.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"273\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings.png\" alt=\"\" class=\"wp-image-5412\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-300x120.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-550x221.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>&#8220;Presets&#8221; is where you can find a list of fonts to choose from.<\/p>\n\n\n\n<p>By default, this theme comes with these fonts. If you choose a setting, the font on your whole website will change.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"319\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-customizer-1.png\" alt=\"\" class=\"wp-image-5413\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-customizer-1.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-customizer-1-300x141.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-customizer-1-550x258.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Besides that, you can change the fonts of certain parts of your theme as well.<\/p>\n\n\n\n<p>Like, you can use a different font for the body and the headers. Even using different fonts for each level of heading is one of your options.<\/p>\n\n\n\n<p>To begin, just pick a font for each part from the &#8220;<strong>Font Family<\/strong>&#8221; dropdown menu.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"338\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-of-individual-elements.png\" alt=\"\" class=\"wp-image-5414\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-of-individual-elements.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-of-individual-elements-300x149.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-of-individual-elements-550x273.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>To change the font size, weight, choose variants, and more, there are more options.<\/p>\n\n\n\n<p>Don&#8217;t forget to click the &#8220;<strong>Publish<\/strong>&#8221; button when you&#8217;re done.<\/p>\n\n\n\n<p>The new font is now on your website. This is what we did: on our demo site, we changed the body font to Roboto and the heading font to Helvetica.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"341\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/font-change-preview.png\" alt=\"\" class=\"wp-image-5415\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/font-change-preview.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/font-change-preview-300x150.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/font-change-preview-550x276.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Keep in mind that not every WordPress theme will have the same features and options for customization as Astra. If that&#8217;s not something your theme has, keep reading to the next step.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Changing_Fonts_in_WordPress_Full_Site_Editor\"><\/span>Changing Fonts in WordPress Full Site Editor<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>The <strong>full site editor (FSE)<\/strong> lets you change your site&#8217;s font if you&#8217;re using a block-based WordPress theme like Twenty Twenty-Two.<\/p>\n\n\n\n<p>In the same way that you update posts or pages using the WordPress content editor, the full site editor lets you change your WordPress theme using blocks. <\/p>\n\n\n\n<p>But <strong>FSE<\/strong> is still in beta, and only a few themes work with it right now.<\/p>\n\n\n\n<p>We are going to use the Twenty Twenty-Two theme for this lesson.<\/p>\n\n\n\n<p>From the WordPress admin panel, go to <strong>Appearance<\/strong> \u00bb <strong>Editor<\/strong> to begin.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"279\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-full-site-editor.png\" alt=\"\" class=\"wp-image-5417\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-full-site-editor.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-full-site-editor-300x123.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-full-site-editor-550x226.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>This will open your WordPress theme&#8217;s full site builder.<\/p>\n\n\n\n<p>After that, click the Styles button in the upper right corner and then select &#8220;<strong>Typography<\/strong>.&#8221;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"391\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-the-style-settings.png\" alt=\"\" class=\"wp-image-5418\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-the-style-settings.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-the-style-settings-300x173.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-the-style-settings-550x316.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>After that, you can pick out things like text and links to change the font used for them.<\/p>\n\n\n\n<p>To change the font, we&#8217;ll pick Text as the element and then click on the &#8220;<strong>Font Family<\/strong>&#8221; dropdown choice.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"306\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-fse.png\" alt=\"\" class=\"wp-image-5419\" style=\"width:680px;height:auto\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-fse.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-fse-300x135.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-fse-550x248.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Just click the &#8220;Save&#8221; button when you&#8217;re done.<\/p>\n\n\n\n<p>By using the full site designer, you were able to change the font. You can also add your own fonts to WordPress and change them in the editor for the whole site.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Change_WordPress_Fonts_Using_a_WordPress_Plugin\"><\/span>Change WordPress Fonts Using a WordPress Plugin<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Using a WordPress plugin like <strong><a href=\"https:\/\/wordpress.org\/plugins\/easy-google-fonts\/\" target=\"_blank\" rel=\"noreferrer noopener\">Easy Google Fonts<\/a><\/strong> is another way to change the fonts in your website.<\/p>\n\n\n\n<p>You can add more than 600 Google fonts and different font styles to your website with this free WordPress typography tool.<\/p>\n\n\n\n<p>First, you need to get the Easy Google Fonts plugin and turn it on. <\/p>\n\n\n\n<p>When you turn Easy Google Fonts on, you&#8217;ll see a welcome screen in your WordPress homepage. Scroll down and click on &#8220;<strong>Go to Settings \u2192 Easy Google Fonts<\/strong>.&#8221;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"254\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-easy-google-fonts-settings.png\" alt=\"\" class=\"wp-image-5421\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-easy-google-fonts-settings.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-easy-google-fonts-settings-300x112.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-easy-google-fonts-settings-550x205.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>You&#8217;ll see different plugin settings on the next screen.<\/p>\n\n\n\n<p>Click the button at the top that says &#8220;<strong>Manage with Live Preview<\/strong>.&#8221;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"226\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/click-manage-with-live-preview.png\" alt=\"\" class=\"wp-image-5423\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/click-manage-with-live-preview.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/click-manage-with-live-preview-300x100.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/click-manage-with-live-preview-550x183.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>You will be in the &#8220;Typography&#8221; tab of the WordPress theme customizer after clicking this.<\/p>\n\n\n\n<p>The plugin adds fonts. You can also get to them by going to <strong>Appearance<\/strong> \u00bb <strong>Customize<\/strong> in your WordPress homepage and clicking on the &#8220;<strong>Typography<\/strong>&#8221; tab.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"329\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-the-typography-tab-1.png\" alt=\"\" class=\"wp-image-5425\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-the-typography-tab-1.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-the-typography-tab-1-300x145.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-the-typography-tab-1-550x266.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>The &#8216;<strong>Default Typography<\/strong>&#8216; choice will be on the next screen.<\/p>\n\n\n\n<p>Click on it now.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"177\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-default-typography.png\" alt=\"\" class=\"wp-image-5427\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-default-typography.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-default-typography-300x78.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/go-to-default-typography-550x143.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>After that, you can change every part of your website&#8217;s style.<\/p>\n\n\n\n<p>To show this, let&#8217;s change the style of Heading 1. To see more choices, just click the arrow next to Heading 1. <\/p>\n\n\n\n<p>Click the drop-down menu next to &#8220;<strong>Font Family<\/strong>&#8221; to choose a font.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"360\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-a-font-using-a-plugin.png\" alt=\"\" class=\"wp-image-5429\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-a-font-using-a-plugin.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-a-font-using-a-plugin-300x159.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-a-font-using-a-plugin-550x291.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Another set of headings and paragraphs can be changed in the same way.<\/p>\n\n\n\n<p>When you&#8217;re done, don&#8217;t forget to click &#8220;<strong>Publish<\/strong>.&#8221;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Change_Fonts_Using_a_WordPress_Theme_Builder\"><\/span>Change Fonts Using a WordPress Theme Builder<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>You can make your own WordPress theme without changing code with a lot of powerful theme builders. They let you change the style of different parts of your website.<\/p>\n\n\n\n<p>We&#8217;ll use <strong>SeedProd<\/strong> for this lesson. With its drag-and-drop builder, you can make your own themes without writing a single line of code. It&#8217;s the best landing page and theme builder tool for WordPress.<\/p>\n\n\n\n<p>Keep in mind that you&#8217;ll need <strong>SeedProd Pro<\/strong> because it has the theme maker. You can also use the free <strong>SeedProd<\/strong> Lite version.<\/p>\n\n\n\n<p>First, you need to get the SeedProd app and turn it on. <\/p>\n\n\n\n<p>You&#8217;ll see the SeedProd welcome screen as soon as you turn it on. Type in your license key and click &#8220;<strong>Verify key.<\/strong>&#8221; The license key is easy to find in your SeedProd account.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"320\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/seedprod-license-key.png\" alt=\"\" class=\"wp-image-5431\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/seedprod-license-key.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/seedprod-license-key-300x141.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/seedprod-license-key-550x259.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>After that, from the WordPress interface, go to <strong>SeedProd<\/strong> \u00bb <strong>Theme Builder<\/strong>.<\/p>\n\n\n\n<p>After that, click the &#8220;<strong>Themes<\/strong>&#8221; button at the top.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"324\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/create-theme.png\" alt=\"\" class=\"wp-image-5432\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/create-theme.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/create-theme-300x143.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/create-theme-550x262.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>The plugin will then show you a list of styles from which to choose.<\/p>\n\n\n\n<p>To use a theme, just move your mouse over it and click on it. For this guide, we&#8217;ll use the Starter theme.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"318\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/starter-theme.png\" alt=\"\" class=\"wp-image-5433\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/starter-theme.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/starter-theme-300x140.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/starter-theme-550x257.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>From now on, SeedProd will make different theme layouts.<\/p>\n\n\n\n<p>You can change your WordPress theme and each design. It&#8217;s even possible to add a theme design by hand.<\/p>\n\n\n\n<p>Let&#8217;s make changes to the styles of different parts of the Homepage theme template. To begin, go to Homepage and click on the &#8220;<strong>Edit Design<\/strong>&#8221; link.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"359\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/edit-homepage-design.png\" alt=\"\" class=\"wp-image-5434\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/edit-homepage-design.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/edit-homepage-design-300x158.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/edit-homepage-design-550x290.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>This will open the drag-and-drop theme maker in SeedProd. From the choices on the left, you can add new things to the template and move them around.<\/p>\n\n\n\n<p>Just click on any theme area to change the font. To show this, let&#8217;s pick the text box under the name Starter.<\/p>\n\n\n\n<p>Next, find the menu on the left and click on &#8220;<strong>Advanced<\/strong>.&#8221; Then, click on &#8220;<strong>Edit<\/strong>&#8221; next to this word.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"357\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-text-in-theme-builder.png\" alt=\"\" class=\"wp-image-5435\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-text-in-theme-builder.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-text-in-theme-builder-300x158.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/select-text-in-theme-builder-550x289.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>After that, you&#8217;ll see a list of choices for changing the fonts in the section you chose.<\/p>\n\n\n\n<p>The drop-down choice next to &#8220;<strong>Font Family<\/strong>&#8221; lets you pick a font for your text. You can also choose the font weight, change the size, line height, letter spacing, orientation, case, and more.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"317\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-builder.png\" alt=\"\" class=\"wp-image-5437\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-builder.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-builder-300x140.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/change-font-in-theme-builder-550x256.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>Now you can go back and change the style of other parts of your theme.<\/p>\n\n\n\n<p>Just click the &#8220;Save&#8221; button at the top when you&#8217;re done.<\/p>\n\n\n\n<p>Go to <strong>SeedProd \u00bb Theme Builder<\/strong> and turn on the &#8220;<strong>Yes<\/strong>&#8221; switch next to &#8220;<strong>Enable SeedProd Theme<\/strong>.&#8221; This will use the custom theme and fonts.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"352\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/enable-seedprod-theme.png\" alt=\"\" class=\"wp-image-5439\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/enable-seedprod-theme.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/enable-seedprod-theme-300x155.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/enable-seedprod-theme-550x285.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Customize_Font_Appearance_in_WordPress_Content_Editor\"><\/span>Customize Font Appearance in WordPress Content Editor<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In the content editor, you can also change the styles used in certain blog posts and pages.<\/p>\n\n\n\n<p>The bad thing about this method is that the new font will only be used on that post or page. You&#8217;d have to do this step by hand for every other post where you want to make the same changes.<\/p>\n\n\n\n<p>This is great for making changes to a single post, but if you want to change the font for the whole site, you should look at the other choices instead.<\/p>\n\n\n\n<p>So, to change the font in the WordPress content editor, all you have to do is add a new post or edit an existing one. To change the way the text looks, select it in the WordPress content manager.<\/p>\n\n\n\n<p>In the settings menu on the right, find the &#8220;<strong>Typography<\/strong>&#8221; part. Then, click the three dots next to Typography and pick &#8220;<strong>Appearance<\/strong>&#8221; from the menu that comes up.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"379\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-in-content-editor.png\" alt=\"\" class=\"wp-image-5441\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-in-content-editor.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-in-content-editor-300x167.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/open-typography-settings-in-content-editor-550x307.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>After you do that, the choices for appearance will show up under Typography.<\/p>\n\n\n\n<p>To change the font style, just click the dropdown menu next to Appearance. You can change the style to be bold, thin, italic, black, bold italic, extra bold, and more.<\/p>\n\n\n\n<p>You can also change the font size, pick a letter case, change the color, add drop caps, and do other things.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"353\" src=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/choose-an-appearance-style.png\" alt=\"\" class=\"wp-image-5443\" srcset=\"https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/choose-an-appearance-style.png 680w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/choose-an-appearance-style-300x156.png 300w, https:\/\/anukulsaini.com\/wp-content\/uploads\/2024\/02\/choose-an-appearance-style-550x286.png 550w\" sizes=\"(max-width: 680px) 100vw, 680px\" \/><\/figure><\/div>\n\n\n<p>When you&#8217;re done, don&#8217;t forget to post or update your page.<\/p>\n\n\n\n<p>This post should have shown you how to change the font in WordPress.<\/p>\n\n\n\n<p>If you liked this post, please follow my <a href=\"https:\/\/www.youtube.com\/@anukulsaini\" target=\"_blank\" data-type=\"link\" data-id=\"youtube.com\/anukulsaini\" rel=\"noreferrer noopener\">YouTube channel<\/a> for more WordPress videos. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Want to change the fonts on your WordPress theme? The text font on your website is a big part of how it looks and how people remember your brand. It can help people read your&#8230; <\/p>\n<p class=\"more\"><a class=\"more-link\" href=\"https:\/\/anukulsaini.com\/how-to-change-fonts-in-your-wordpress-theme\/\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":5446,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[101],"tags":[90,115],"_links":{"self":[{"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/posts\/5228"}],"collection":[{"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/comments?post=5228"}],"version-history":[{"count":17,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/posts\/5228\/revisions"}],"predecessor-version":[{"id":5448,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/posts\/5228\/revisions\/5448"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/media\/5446"}],"wp:attachment":[{"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/media?parent=5228"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/categories?post=5228"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/anukulsaini.com\/wp-json\/wp\/v2\/tags?post=5228"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}