WordPress font color modification guide

You can easily change the font color in your WordPress website for a small section of text or a block. Alternatively, you can change the color of specific elements or CSS classes throughout your website.

In this quick tutorial, I will show you how to quickly change the font color in your WordPress website.

I will show you two methods:

• Change the font color of individual blocks.
• Add a CSS class to the color block and then style the class.

I'll also give you an overview of how to use stylesheets to change font color throughout your website.

If you want to know how to add a brand new font to WordPress or how to change the font size in WordPress, you can find out how here too.

How to change the font color of the text part

You can choose to set a portion of text or an entire block of text in a post or page to a different color than other posts or pages. You can use it to highlight certain text and make it stand out, or to enhance the design of your website.

Warning: Too many colors can make your site look cluttered and unprofessional. Make sure to use non-conflicting colors.

First find the part of text you want to change the color of.

Double-click to select the text you want to change color. Click the arrow icon above the block and select Text Color.

Choose the color you want your text to have. The colors in the edit screen will change for you.

Alternatively, you can use hex codes to select a specific color. This is a good idea if you want to use colors used elsewhere on your site.

Click the Custom Color link and select a color from the selector or enter a hex code.

Repeat this for any other text blocks or sections of text that you want to change the color of. You don't have to change the color of the entire block - you can just change a word if you want.

Finally, click Update to update your post, or Publish to publish it. This will save your changes.

Now your text will be whatever color you gave it:

How to change font color using CSS classes

If you want to change a bunch of text blocks so that they all have the same color, the best way is to use CSS classes. This way you know they are all the same color and you don't have to remember which color you used.

Find your text block again and open the Advanced tab in the Blocks pane.

In the Other CSS Classes field, enter the CSS class. I'll use highlight-color. I intentionally left the color unnamed in case I decided to change it later.

Now click Update or Publish to save your post.

You now have two options for editing the color of blocks using this class:

• Add styles in customizer
• Add styles to the theme’s stylesheet

Styling a class in the customizer is the easiest way and won't cause you any problems when updating your theme.

Go to Appearance > Customize in your WordPress admin and click Additional CSS.

In the Other CSS pane, enter CSS to change the font color: p>

.highlight-color {
 color: #e76d16;
}

Use the hex code to change the color in that code to whatever color you want to use. It's best to use colors that are used elsewhere in the theme, or use colors that match the theme while making the text stand out.

Click the Publish button to save your changes.

Now go to the post in your live site and you will see that the block with the class highlight-color has a different color than the text around it:

Now you can use this class for any block you want to set that color.

Change font color in theme stylesheet

With the two methods I show you, you don’t need to edit the files in your theme or have a deep understanding of CSS. They provide you with a quick way to change WordPress font colors.

However, if you want to edit the colors of existing elements in your site (such as all paragraphs or links), or if you want to add CSS in the stylesheet instead of the customizer, you will need to edit your theme's stylesheet.

You can find more information about editing stylesheets in our guide to adding custom CSS to your WordPress site. If you want to go deeper, this is a great place to start.

in conclusion

Changing the font color of text in your WordPress site only takes a few minutes. You can edit the font color directly, or you can give it a class and write CSS for your class.

But whatever you choose to do, don't go overboard. And make sure the colors you use work well together to avoid the site looking cluttered and unprofessional.

Make your website stand out with a professional WordPress theme

Are you designing a new WordPress website? Our collection of professionally designed WordPress themes can give your website a beautiful new look and feel in minutes.

Here are some of the best-selling and emerging WordPress themes launched in 2020 by ThemeForest. p>

The above is the detailed content of WordPress font color modification guide. For more information, please follow other related articles on the PHP Chinese website!