Product Template - Custom Template Is Throwing off styling

Hi. I am working on a Shopify site for a client. I am not an expert, however my issue is that I am more wondering why something is happening.

The product.liquid file is mostly empty with a couple of includes.


{%- comment %}{% endcomment -%}

{% section 'product-template' %}
{% include 'facebook-tags' %}

So to me this looks okay. Most of the code is contained in the product-template.liquid file in sections. I am creating a new product template, so I have assumed that all I am going to do is create a template called product.coffee.liquid and I’ll duplicate the code above and add a product-template-coffee.liquid file in sections. This is pretty straightforward for me.

My new template now looks like this.


{%- comment %}{% endcomment -%}

{% section 'product-template-coffee' %}
{% include 'facebook-tags' %}

The only difference in the two files in the section include. I have duplicated both section includes so they are idential. My problem is, the coffee template is throwing off the styling on the page even though the two product template includes are exactly the same.

Can anyone let me know if there is something I am missing here? Are there other default flies being discluded because I have created a new template?

Thanks in advance for any insight. This is the last thing I need to figure out to complete my project and I am totally stumped.

Could be you have a CSS rule that targets a section called product-template like .section–product-template{…} and other things inside it, which isn’t working on the product-template-coffee template. Hard to say without seeing the issue.

Thank you for the reply. This helped me start thinking about other potential problems. There were a couple styles that were targeting the product.template class, however I also needed to the settings_data.json file which has a bunch of layout and option settings that was being ignored, once I changed the template.

Thank you again for the reply. All good now.

1 Like