Hiding the first image on the product page on Impulse Theme

[liamfoyandco1]

I'm looking to remove the first product image on my product page on the impulse theme as I need it for the collection page but not on the product itself. Can anyone help? 

[oscprofessional]

Hello @liamfoyandco1 ,

There are two approaches you can take to hide the first image on your product page in Shopify's Impulse theme:

1. Using CSS (For Users Comfortable with Code):

This method involves adding a bit of CSS code to your theme. Here's how:

• Go to your Shopify admin panel and navigate to Online Store -> Themes.

• Click on Actions and select Edit code.

• In the Templates folder, locate the file named product.liquid.

• Find the section of code responsible for displaying product images. It might look something like this:

{% for image in product.images %}
  <img src="{{ image.src | img_url: 'master' }}" alt="{{ image.alt }}">
{% endfor %}

Paste the following CSS code after the closing curly brace } of the for loop:

.product-gallery img:first-child {
  display: none;
}

• This code targets the first child element (img:first-child) within the .product-gallery class and hides it using display: none;.

• Save your changes and preview your product page to see if the first image is hidden.

2. Third-party App (For Users Less Comfortable with Code):

If you're not comfortable with code editing, consider using a third-party app like "Conditional Featured Products" (https://community.shopify.com/c/shopify-apps/product-options-apps-with-conditional-logic-and-option-...). This app allows you to control which product image is displayed on the product page based on specific conditions.

Important Note:

• Modifying your theme code can potentially cause issues if not done carefully. It's recommended to back up your theme before making any changes.
• If you're unsure about making these edits yourself, consider reaching out to a Shopify expert or the Impulse theme developers for assistance.

By following either of these approaches, you should be able to hide the first image on your product page in the Impulse theme.

[liamfoyandco1]

Hi,

Thanks for the reply. I can't find a product.liquid file in the code editor. I have attached a screenshot of all files containing product.

Would it be in any of these? i did a find search in all folders and couldn't find that piece of code.