How to add H1 tag on Shopify store homepage

How to add H1 tag on Shopify store homepage
By purchasing through the links on this page, you are giving us the opportunity to earn a commission. Your support is greatly appreciated!

Customizing the H1 on your Shopify store homepage (or adding one, if the heading tag doesn’t exist) can be a bit more complicated than you might initially expect. It’s a common question for a lot of new store owners. This is because by default, the H1 on your homepage is your store name.

Let's delve into how to make the most of this essential Shopify component for an appealing and profitable online presence.

What is an H1 on a Shopify store homepage?

When you see a headline in the largest font on the page, that’s likely an H1. H1’s, particularly on the homepage, are a type of code-level formatting that indicates the information in the heading is the primary topic covered on the page.

For example, your H1 heading might be “Vintage Sneakers from Cool Kicks”, with sub-headings (H2-H6) like “Women’s Shoes”, “Laces”, “Shoe Care & Maintenance.” Usually H1’s are also the largest text on the page visually; this isn’t a requirement though.

Want to check your overall store SEO optimization and health? TinyIMG app can help

Audit your store today

How to add H1 tag on Shopify store homepage

Whether or not your homepage will have an H1, where it will be, or what it will look like can depend on the theme you use. The steps we go through here may not be exactly what you need to do – they should give you a place to start though.

For many Shopify themes, the homepage H1, if it’s present, is your store name. Sometimes it’s also your website logo, which isn’t ideal. If you think you don’t have an H1 on your website, it’s best to check first.

To find out if you have an H1 tag on your homepage, you want to right-click on your website homepage and click “Inspect”.

right-click and select inspect tool from the menu

Once you do that, you’ll want to hit Ctrl+F (or Cmd+F) and do a find for <h1.

find page heading tag in the code using search

We’ll assume you don’t have an H1, unlike the above example. To add an H1 to your homepage, you’ll want to follow this process:

1. From the admin menu, go to Online Store >Themes.

2. Choose your active theme, and Customize.

3. Add a Custom HTML section where you’d like to include an H1.

adding custom html section to a shopify store homepage to add h1 tag

4. Hit Save.

5. Confirm on the live website the H1 has been updated.

To modify an existing H1 on your homepage you’ll likely need to go into the theme.liquid files and, find the H1, and edit it there.

Suggested reading

A few Shopify homepage H1 tag examples

There are a lot of different ways Shopify stores address (or don’t address) the default H1 setup in Shopify. For example:

AllBirds has only one H1 on their homepage, which is the text of their primary a-feature and offer on the homepage. This is generally best practice and what website owners should be aiming for.

allbirds store homepage heading 1 example

Jeffree Star Cosmetics has an H1 they use for screen readers (indicated by the class of the H1, and the fact we can’t see it on the page). This is generally not the best practice because it’s hiding the H1 from the user.

jeffree star cosmetics store indicated homepage h1 for screenreaders

The Gymshark homepage had 18 H1 elements at the moment of our research, which is less than ideal, even for HTML5-built websites.

gymshark has multiple h1 tag elements on its shopify store homepage

Is it a problem if the Shopify store homepage has no H1?

Not having H1 on the Shopify store homepage may impact your SEO and also customer experience. Search engines, including Google, use H1 to understand the context of a web page. Without it, they may find it difficult to determine the content on your page and rank your website accordingly.

Similarly, H1 on the Shopify store homepage allows customers to get an idea of what your website is about. It also improves accessibility for people with disabilities who use digital readers, as having an H1 enables these readers to provide accurate information about the web page.

To conclude, H1 on the Shopify store homepage is an essential feature for better readability for both people and computers. It can work not only as an accessibility aspect but also as a branding strategy, reminding your site visitors about your brand values.

Frequently asked questions

Including an H1 tag on your website pages is best practice, as it helps Google and other search engines understand “at a glance” what the focus of that page is.

You can, but it’s generally not a great idea. Search engines and screen readers both have trouble reading the content of images. It should be copy in HTML.

There are no firm guidelines with H1 tags, like there are with meta titles and descriptions. The length of an H1 should be in line with your design guidelines and aim to not overwhelm visitors to your website.

If you can, yes, you should include important topics in your Shopify store’s H1, particularly on your homepage. Be careful to avoid keyword stuffing; you want the H1 of your website to read naturally in a way that makes sense and doesn’t feel spammy.

About the author
Nikoleta Kokleviciute
Nikoleta is a Marketing Manager at TinyIMG, an app for image and SEO optimization for Shopify merchants. Nikoleta loves diving deep into digital marketing, eCommerce, social media trends, and creating content that benefits its readers!