Fixing Heading Tag Structure For SEO Friendly Blogger

«Prev Next»

Before further discussion to fix the composition of heading tags in the template, it helps you know what the tags H1, H2 and H3 and the place was supposed to ease your understanding.

1. <h1>  title or blog title </ h1>
2. <h2>  post or article title </ h2>
3. <h3>  blogger widget title </ h3>

After learning the functions and the explanation above, let us now proceed to the next stage which is to improve the structure H1 to H3 tag.

• Login to blogger
• Templates »Edit HTML» Expand Widget Templates
• To prevent errors when repairing the structure tag, I suggest to backup your template first

First

Search: #header h1 { Then replace it with this: #header h1, #header p {

Second

Find the CSS code like this: .post h3 { Replace with this: .post h1, .post h2{

Third

Find more: .post h3 a,.post h3 a:visited,.post h3 strong {Replace with this code: .post h1 a,.post h1 a:visited,.post h1 strong,.post h2 a,.post h2 a:visited,.post h2 strong{ 

Fourth

Find more of this: .post h3 strong,.post h3 a:hover {Replace with: .post h1 strong,.post h1 a:hover,.post h1 strong,.post h2 a:hover {

Fifth

Find this code: h2.date-header {Change into: .date-header {
Continue to look for: <h2 class='date-header'> <data:post.dateHeader/> </ h2> and replace them with: <div class="date-header"><data:post.dateheader></data:post.dateheader></div>

Sixth

Find the code below:
<h1 class='title'><b:include name='title'/></h1>Replace with this:
<b:if cond='data:blog.pageType != "item"'><h1 class='title'><b:include name='title'/></h1><b:else/><p class='title'><b:include name='title'/></p></b:if>

Seventh

Find this code:
<h1 class='title' style='background: transparent; border-width: 0px'><b:include name='title'/></h1>Replace become like the code below:
<b:if cond='data:blog.pageType != "item"'><h1 class='title' style='background: transparent; border-width: 0px'><b:include name='title'/></h1><b:else/><p class='title' style='background: transparent; border-width: 0px'><b:include name='title'/></p></b:if>

Last

Find the following code:
<b:if cond='data:post.title'><h3 class='post-title entry-title'><b:if cond='data:post.link'><a expr:href='data:post.link'><data:post.title/></a><b:else/><b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/><data:post.title/></b:if></b:if></h3></b:if> with code like below
<b:if cond='data:blog.pageType != "item"'><b:if cond='data:post.title'><h2 class='post-title entry-title'><b:if cond='data:post.link'><a expr:href='data:post.link'><data:post.title/></a><b:else/><b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/><data:post.title/></b:if></b:if></h2></b:if><b:else/><h1 class='post-title entry-title'><b:if cond='data:post.link'><a expr:href='data:post.link'><data:post.title/></a><b:else/><b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/><data:post.title/></b:if></b:if></h1></b:if> 

• Save the template and feel the difference.

If the steps above you still do not understand, please ask by way of comment. Thank you!

«Prev Next»