Modifying Heading Tags In WordPress Posts
WordPress has a lot of features and functions built in that most people rarely use. Themes themselves come with a style sheet that pre-sets many of the functions that could be used. One of those functions is the heading tag. These come in the form of H1, H2, H3 and H4.
There are suggestions that if you use these tags for headings in your posts you can increase the headings value when it comes to SEO, for example, having a heading that includes your keyword or keyphrase. Use one of those heading tags and you are telling the search engine it is important.
However, I often find that headings are set for the site and do not always sit comfortably within a post. They are too big, too small or the wrong color. What many writers don’t know is that each heading tag can be modified on the fly so that it does suit your post. Take a look at the following examples:
Heading 1
Heading 2
Heading 3
Heading 4
Now let’s see what happens when we modify them:
Heading 1
Heading 1
Heading 1
To achieve this result, you need to start with heading tag – for example the h1 tag – these are inserted between <>. To modify this tag you need to use the correct formatting command. These are also inserted between <> tag holders:
font size=”-1″ or -2, +1 +2 etc
You can adjust the size to suit your post. The size of the text in my posts means the H1 tag is far too big – by using the size=”-1″ option it looks much neater and suits the size of the text around it.
font color=”red” or blue or black or white
In the last example shown, I used the font size=”-1″ color=”blue” combination all within the one tag placeholder <>.
A typical command would like the following – to make life easier I have used [ ] instead of the <> to make it easier to read. Remember to replace the square brackets when you try these commands.
[h1] [font size="-1" color="blue"]Your text here[/font] [/h1]
The last two pieces of the command are particularly important. They effectively close the command at that point which means the formatting wont flow through to the rest of your site.
There you go – it’s quick, it’s easier, and you can do it on the fly whilst creating your next super post.
Or, like me, you can cheat and use Windows Live Writer! Ok, so it helps to understand a bit about the codes so you can go in and manually fix the stuff ups (of which there are many), but it gives you the code to begin with. A good foundation is always necessary for being in control.
Pretty soon, I won’t be hassling you to help me with my site at all! Then what are you going to do with yourself?
Won’t this be taking a step back in design? I will rather have a different class for h1 and use style sheet to set the actual size of font. Font sizes within HTML is a 2 years old style.
The equivalent inline style definition would be:
[h1 style="font-size:smaller"]your text here[/h1]
Or if you want to change it for your entire site, modify the style.css file, as the previous commenter has suggested.
One of the great things about a blog is the input from visitors. Jeet for most bloggers, digging around the CSS file is not something they are game to do.
Knowing the code to make minor adjustments as your writing a post can be easier – but yes, going back in time a little.
Rod – thanks for your input. I must admit I hadn’t tried to put the code in the one command.
I would be interested in hearing other commands that could be included as well.
Les
Thank you so much! I feel like I always end up having these WordPress snafus so it is especially helpful to understand using the heading tag to contain keywords for Seo purposes.
this one is great .perfectly written. much useful. thanks .keep sharing.