Add Static image to product grid in collection (Be Yours Theme)

[talonwr]

I want to add static images at regular intervals within the product grid part of my collection pages. 

I want each static image to appear as 2 products wide and to show after every other row alternating sides like so

product	product	[Image	Here]
product	product	product	product
[Image	Here]	product	product
product	product	product	product
product	product	[Image	Here]

I want to do this on the "Be Yours" theme. I want the [image here]'s to be pulled from a collection metafield I already made titled "In-Grid Images".

Anyone know how I would go about doing that?

[Guleria]

Try this

{% for product in collection.products %}
  <!-- Render product details here -->
  // Exisitng code // call for product loop
  {% if forloop.index == 3 %}
    <!-- Insert static image after every 3rd product -->
    <img src="path_to_static_image_1.jpg" alt="Static Image 1">
  {% elsif forloop.index == 6 %}
    <!-- Insert static image after every 6th product -->
    <img src="path_to_static_image_2.jpg" alt="Static Image 2">
  {% endif %}
{% endfor %}

Noe: You need to adjust the html a/to your need in the code.

Thanks

[johndepict]

we built a no-code collection page/grid builder so that you don't have to solve this with custom code: https://apps.shopify.com/depict

works natively with most shopify themes (should work with "be yours")

just ping me if you have any questions!