{"id":1222,"date":"2019-11-23T13:23:13","date_gmt":"2019-11-23T13:23:13","guid":{"rendered":"http:\/\/ithemelandco.com\/revenue-acceleration-key-to-get-our-mojo-back-says-cognizant-ceo-brian-humphries\/"},"modified":"2020-09-17T06:31:17","modified_gmt":"2020-09-17T06:31:17","slug":"how-to-change-the-font-color-in-wordpress","status":"publish","type":"post","link":"https:\/\/ithemelandco.com\/blog\/how-to-change-the-font-color-in-wordpress\/","title":{"rendered":"How to Change the Font Color in WordPress"},"content":{"rendered":"\n<p>Changing the font color in your <a href=\"https:\/\/wordpress.org\" target=\"_blank\" aria-label=\"undefined (opens in a new tab)\" rel=\"noreferrer noopener\">WordPress<\/a> site is something you can easily do for a small section of text or a block. Alternatively you can change the color of a specific element or a CSS class throughout your site.<\/p>\n\n\n\n<p>In this quick tutorial, I\u2019ll show you how to quickly change the font color in your WordPress site.<\/p>\n\n\n\n<p>I\u2019ll show you two methods:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Change in an individual block.<\/li><li>Adding a CSS class to a block for color and then styling the class.<\/li><\/ul>\n\n\n\n<p><p>I\u2019ll also give you an overview of changing the font color across your site, using your stylesheet.<\/p>\n<p>&nbsp;<\/p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How to Change the Font Color of a Section of Text<\/strong><\/h3>\n\n\n\n<p>You can choose to make a section of text or a whole block of text in one of your posts or pages a different color from the rest. You can use this to highlight some text and make it stand out, or to enhance the design of your site.<\/p>\n\n\n\n<p>A word of warning: too many colors will make your site look messy and unprofessional. Make sure you use colors that don\u2019t clash.<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<p>Start by finding the section of text whose color you want to change.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/font-paragraph-block.jpg\" alt=\"a paragraph text\" class=\"wp-image-3233\" width=\"900\" height=\"375\" srcset=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/font-paragraph-block-500x209.jpg 500w, https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/font-paragraph-block-150x63.jpg 150w\" sizes=\"(max-width: 900px) 100vw, 900px\" \/><\/figure>\n\n\n\n<p>Select the text you want to change the color of by double clicking it. Click the arrow icon above the block and select&nbsp;<strong>Text Color<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/text-color-selection.jpg\" alt=\"change color of text in wordpress\" class=\"wp-image-3234\" width=\"900\" height=\"500\"\/><\/figure>\n\n\n\n<p>Choose the color you want the text to have. The color will change for you in the editing screen.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img decoding=\"async\" src=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/changing-font-color.jpg\" alt=\"select color of text\" class=\"wp-image-3231\" width=\"900\" height=\"555\"\/><\/figure>\n\n\n\n<p>Alternatively, you can use a hex code to select a specific color. This is a good idea if you want to use a color that\u2019s used elsewhere in your site.<\/p>\n\n\n\n<p>Click the&nbsp;<strong>Custom color<\/strong>&nbsp;link and either select a color from the picker or type in the hex code.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/custom-color-selection.jpg\" alt=\"color picker of text\" class=\"wp-image-3232\" width=\"971\" height=\"517\" srcset=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/custom-color-selection.jpg 850w, https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/custom-color-selection-500x266.jpg 500w, https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/custom-color-selection-150x80.jpg 150w\" sizes=\"(max-width: 971px) 100vw, 971px\" \/><\/figure>\n\n\n\n<p>Repeat this for any other blocks of text or sections of text whose color you want to change. You don\u2019t have to change the color of a whole block\u2014you can just change one word if you want.<\/p>\n\n\n\n<p>Finally, click&nbsp;<strong>Update<\/strong>&nbsp;to update your post or&nbsp;<strong>Publish<\/strong>&nbsp;to publish it. That will save your changes.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/text-with-new-color-in-live-site.jpg\" alt=\"paragraph with different colors\" class=\"wp-image-3235\" width=\"900\" height=\"200\" srcset=\"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/text-with-new-color-in-live-site-500x112.jpg 500w, https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/text-with-new-color-in-live-site-150x34.jpg 150w\" sizes=\"(max-width: 900px) 100vw, 900px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Changing the font color in your WordPress site is something you can easily do for a small section of text or a block. Alternatively you can change the color of a specific element or a CSS class throughout your site. In this quick tutorial, I\u2019ll show you how to quickly change the font color in [&hellip;]<\/p>\n","protected":false},"author":1458,"featured_media":3237,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[50,52],"tags":[],"class_list":["post-1222","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","category-wordpress"],"featured_image_url":"https:\/\/ithemelandco.com\/blog\/wp-content\/uploads\/2019\/11\/font-color-bg-370x237.jpg","excerpt_plain":"Changing the font color in your WordPress site is something you can easily do for a small section of text or a block. Alternatively you can change the color of a specific element or a CSS class throughout your site. In this quick tutorial, I\u2019ll show you how to quickly change the font color in [&hellip;]","_embedded":{"wp:term":[[{"term_id":50,"name":"Tutorials","slug":"tutorials","term_group":0,"term_taxonomy_id":50,"taxonomy":"category","description":"Follow and learn the latest educational articles about WordPress plugins and WooCommerce here","parent":0,"count":256,"filter":"raw"},{"term_id":52,"name":"WordPress","slug":"wordpress","term_group":0,"term_taxonomy_id":52,"taxonomy":"category","description":"Do you use WordPress to manage your online business? We suggest you read this category of WordPress tutorials.\r\n<div id=\"gtx-trans\">\r\n<div class=\"gtx-trans-icon\"><\/div>\r\n<\/div>","parent":50,"count":46,"filter":"raw"}]]},"_links":{"self":[{"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/posts\/1222","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/users\/1458"}],"replies":[{"embeddable":true,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/comments?post=1222"}],"version-history":[{"count":0,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/posts\/1222\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/media\/3237"}],"wp:attachment":[{"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/media?parent=1222"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/categories?post=1222"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ithemelandco.com\/blog\/wp-json\/wp\/v2\/tags?post=1222"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}