H1 Headings

Store Design
,
4

Hey @MrsMacca ,

As you mentioned after adding the featured product section, your homepage now has 2 H1s, it is because the theme default structure adds the product title in an H1 tag. To remove the additional H1 tag coming from the featured product section you can follow the below steps:

  1. Duplicate your current live theme before making any changes.

Refer to this doc: https://help.shopify.com/en/manual/online-store/themes/managing-themes/duplicating-themes

  1. Open the theme file editor, by navigating to Online store > Themes > Click the three dots (…) > Edit code.

  2. Search for the “Featured Product” file in the sections folder. It can be by the name of “featured-product.liquid”.

  3. Look for the code that is responsible for showing the product’s title, the code might look something like as shown in the code below:

# {{ product.title }}
----------------------------------------------------------------------
# {{ product.title | escape }}
  1. Update the code by replacing the opening H1 (

    ) tag with H2 tag (

    ) and closing H1 tag (

    ) with closing H2 tags (). Such that your updated come becomes like:
## {{ product.title }}
----------------------------------------------------------------------
## {{ product.title | escape }}
  1. Done? Now try previewing the theme file to verify if the additional H1 tag is removed from the homepage.

One important point to note is that these adjustments could bring potential design issues to the layout, like reduced font size and boldness for the heading, which you might need to fix.

If you are not comfortable editing the code yourself, you should hire a Shopify developer, who will help you with these changes.

I hope this helps!

Regards,

Abhishek from Swym

1 Like