Add a H1 Tag To Your Entire Weebly Blog

This webpage contains affiliate links. For more info, see my policy here.
Weebly Blog achive and category pages don't have H1 headers, which can harm your SEO. Here's a super quick and easy method for fixing this.

Introduction

Titles are important for ranking your web pages in search engines. Someone didn’t tell Weebly that. They made each blog pot’s heading be a h2 tag, making those pages completely lack a h1 tag.

Some clever coders at EditorTricks have found ways to make your blog’s titles into SEO-friendly h1 tags. I used their tutorial to great success. I thought that would be that in terms of SEO for my blog posts. But how wrong I was.

I ran my webpage though Neil Patel’s free audit tool, and found that my main blog page was coming up with a warning. “Title too short”. The title it thought I had was “Blog – Jessica Amber”. Auto-generated, and definitely short. But Weebly doesn’t offer any settings or method to change that title.

Changing this isn’t just relevant to SEO. What if you want one title to appear above every blog post, including your category and archive pages? It improves branding, and can give more consistency to your blog.

Adding a h1 to Every blog page

Step 1
In Weebly, go to the Theme tab, then click Edit HTML/CSS at the bottom left of the page.
 
Step 2
In the left column of website parts, click Blog, then click layout.tpl
 
Step 3
In the code box, under the line <td valign=”top”>, add the following code:
				
					<h1 style="color:lightgray">YOUR TITLE HERE</h1><br>
				
			

I replaced the title with ‘Jessica Amber’s Blog’. Change it to something similar, or maybe a slogan.

You can also change the colour as you see fit. I made it light grey so it didn’t compete for attention with the individual blog post’s titles. And the <br> at the end just adds a bit of space under the heading.

Here’s how the whole code should look, assuming you’ve never edited it before:

				
					{{!
    The overall layout for a blog's sidebar and main content area.
    NOTE: "blog-sidebar" is a required class for the editor to function correctly.
}}
<tr>
    <td valign="top">
<!--17 June 2020 testing if i can add a h1--><h1 style="color:lightgray">Jessica Amber's Blog</h1><br>
        {{{main_html}}}
    </td>
    {{#has_sidebar}}
        <td class="blog-sidebar" valign="top">
            {{{sidebar_html}}}
        </td>
    {{/has_sidebar}}
</tr>
				
			

Conclusion

This is how my blog looked after adding this code:

Weebly blog edit screen, showing a light grey H1 heading above blog post heading

This code has added a subtle title to the whole blog, so readers will always know where they are, and the presence of this h1 tag will help the page rank better in Google search results.

I hope this mini-tutorial has been helpful for you. If you have any questions, don’t hesitate to leave a comment, I’m always happy to help in the Weebly community where possible.

Peace, love and sunshine (even though it may be raining),

Handwritten calligraphy-style signature that says 'Jessica' with a heart dotting the i