How to change default h1 h2 h3 tags to lower/Mixed case In WordPress using Custom CSS

Do you want to know how to change default H1 H2 H3 tags to lower case In WordPress using Custom CSS?


Well, You’ve just arrived at the solution because in this article am going to show you the exact method I changed my default H1 H2 H3 tags to lower/mixed case on my WordPress theme using a custom CSS codes.

Changing the uppercase headings to lowercase plays an important role in writing to people and SEO.
Readers get confused whenever they get to see too many uppercase letters.
It happens.
Whenever I visit a site, the first thing that makes friends with them is the typography and headings.
Most sites use friendly typography and headings for easy understanding to users.
This same problem I had with my WordPress blog and I could override it.
My themes h1, h2, and h3 were all capitalized which made my contents look unfriendly to users.
Although nobody has laid a complaint about them, I decided on my own to make it user-friendly.
And my theme was changed, which add more to the problem at hand.
So here in this blog, I will share with you my problem and how I overcame the issue.
Using this step-by-step guide you will override the uppercase letters to show normal uncapitalized letters.
and also change it to your desired typography.
Without wasting much of your time let me go straight to the main topic.
First, you need to understand the way it works.
It works.
Most themes from mythemeshop come with the headings and sidebar title upper case with a different typography.
It is now left for you to override the settings via your site.
Sometimes it might be difficult to change since the theme has no place or tool that will help change the heading typography.
But with this line of codes, you can override them and then rock it on.
These codes come in CSS format which means you need to be a little careful about how and where to place the codes to work with your theme.
Without further ado, I will show how it is possible and where to place these codes without losing your theme design.
Here is how to do it
Step 1 log in to your WordPress Admin Dashboard
Step2
Option 1. Navigate to Appearance>> Customize>> Additional CSS
 Option 2. Navigate to Appearance>>> Custom CSS.
Step 4 copy the code below and add it to the blank area as seen.
h1, h2, h3 {
text-transform: none !important;
}
Step 5 Save the theme.
Here is a quick video on how to locate your CSS editor from your WordPress Dashboard.
If you are you using a cache plugin, make sure you clear your cache for the code to take effect otherwise try it.
If you tried it and it doesn’t work for you.
Contact your web developer or theme vendor.
The steps above helped me to override my themes heading.
I hope it helps you too.

Read Also  On page optimization Techniques.

Written by Yusuf Bitrus

I'm a Digi-Preneur, Affiliate Marketer, SEO intermediate and Blogger by heart.
I Help bloggers and business by writing and providing solutions digitally via my blogs, social media, and online/offline events.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.