Change the h1 of featured product.liquid

Viewed 18

I am working with a page that has multiple h1's, the reason is becuase feature products have a h1 in their title.

This is what's inside featured-product.liquid, the rest is schema

{%- if section.settings.divider -%}<div class="section--divider">{%- endif -%}

{%- assign product = all_products[section.settings.featured_product] -%}
{%- if product != blank -%}
{%- render 'product-template',
  product: product,
  section_id: section.id,
  blocks: section.blocks,

  image_position: section.settings.image_position,
  image_container_width: section.settings.image_size,
  product_zoom_enable: section.settings.product_zoom_enable,
  sku_enable: section.settings.sku_enable,
  thumbnail_position: section.settings.thumbnail_position,
  thumbnail_arrows: section.settings.thumbnail_arrows,
  mobile_layout: section.settings.mobile_layout,
  video_looping: section.settings.enable_video_looping,
  video_style: section.settings.product_video_style,
  is_recommendation: true
-%}
{%- endif -%}

It seems that I am simply telling the code what information to take, but how can I make that only in this area the title has a h2? I have been researching for hours on this topic, but I can't find much information.

I am working with the impulse template

1 Answers

inside featured-product.liquid you see the code of:

{%- render 'product-template',
......
-%}

which is referring that you are including a snippet called 'product-template' so on folder snippets you will find a file called product-template.liquid, open that file, and you will find the <h1> you can change it to <h2> if you want


if you want to keep product-template.liquid to keep using <h1>on some other places, then:

  1. Duplicate this snippet product-template.liquid to make new-product-template.liquid and on the new-product-template.liquid change the <h1> to <h2>

  2. Inside featured-product.liquid use the duplicated snippet new-product-template.liquid so it will be: {%- render 'new-product-template', ..... -%}

Related