adding Image in the product grid dawn theme

Shopify Partner
6 0 0



I would like to display an image in the product grid.

I would like to add the image on the first page after 2nd product.


Please see reference image below,





I've tried below code in main-collection-product-grid.liquid but did not work

{% if forloop.index == 4 and current_page == 2 and collection.title == "Sale" %}
        <li class="grid__item medium-up--two-quarters" >
          <div class="grid-view-item product-card " style="height: 100%;">
            {{ 'banner1.png' | asset_url | img_tag }}

Can anyone help me find the solution?

my website is

Reply 1 (1)

Shopify Partner
6 0 0


with the code below, I was able to show images in the product grid.

However, I don't want to banner to be looped, only show 1 photo in the page.

I want to show image like the table below.



{% for product in collection.products %}
<!-- Render product details here -->
{% if forloop.index == 5 %}
<!-- Insert static image after every 3rd product -->
<img src="" alt="Static Image 1" style="height:75%; width:66%;">
{% elsif forloop.index == 8 %}
<!-- Insert static image after every 6th product -->
<img src="" alt="Static Image 2"style="height:75%; width:66%;">
{% endif %}
{% endfor %}


This is what is currently showing with that code