How can I add a banner image within the product grid in the collection template? (see below) [grid-1.PNG] I added this code to my collection template {%- if forloop.index == 1 -%} and it places the images on the second product grid instead of the first one, how do I put the images on the first on…

Hi @albertloekito , Sorry, you didn’t tag me, so I didn’t get the notification before. Please change all code: {% paginate collection.products by section.settings.coll_num_per_page_int %} {%- liquid if section.settings.show_image_behind_heading and collection.image assign header_image_enabled =…

Hi @LitExtension Sorry it did not work, see below https://59ucm304k9f421j1-1608220771.shopifypreview.com

Hi @albertloekito , Please change code: {% if collection.handle == 'new-arrivals' %} {%- if forloop.index == 4 -%} [ ](https://yellowboxshoes.com/collections/all-sale) [ ](https://yellowboxshoes.com/collections/all-sale) {%- endif -%} {%- endif -%}…

Hi @LitExtension Sorry still not working https://2lvpuu3rsk05tioy-1608220771.shopifypreview.com I try to make something like this below, so product 3 and 4 have full banner https://sokoglam.com/collections/cleansing-balms

Hi @albertloekito , I got the wrong information, I think you are trying to show the full banner. Are you wanting this? show only 1 image for positions 3 and 4 [Screenshot.png] Please change code: {% if collection.handle == 'new-arrivals' %} {%- if forloop.index == 2 -%} [ ](…

Hi @LitExtension The code works great, and sorry one last thing Can I show the banner only on the first page of the collection?

Hi @albertloekito , Please change all code: {% if collection.handle == 'new-arrivals' %} {%- if forloop.index == 2 and paginate.current_page == 1 -%} [ ](https://yellowboxshoes.com/collections/all-sale) {%- endif -%} …

Hi @LitExtension it works great, Thank you so much for all your help, appreciate it.

Hi @LitExtension Sorry forgot to ask you one more thing, how do I put a text overlay on the images? I try to create a text container but the text is not on top of the images.

Hi @albertloekito , You can add text and send me a link preview, I will check it

Hi @LitExtension Here’s the link https://o3rys3kj7da9h2rq-1608220771.shopifypreview.com

Adding Banner Image To Product Grid In Collection Template

Store Design

kannysocool August 29, 2023, 6:32am 25

Hi, I’m using the Refresh theme, i also want to add a banner image To Product Grid In Collection Template, can you help me?

Topic		Replies	Views
Add static image or text to collection grid Store Design	11	91	October 5, 2022
How can I add banner images to my collections? Store Design design , collection-page	4	81	January 20, 2023
Create a "See More" button at the end of a Featured Collection in Home Page - BROOKLYN THEME Store Design	13	90	August 26, 2021
Collection page on mobile ( Palo Alto Theme) Shopify Discussion	4	100	September 4, 2020
HELP PLS. Add Collection description to Product page Technical Q&A	0	23	April 8, 2022

Adding Banner Image To Product Grid In Collection Template

Related topics