I wanted to share a trick I came up with to add banners in between products on a collection page. I wasn’t able to find how to do it elsewhere so I thought it might be helpful to others. I’ve used it to break up a products page by putting up banners that recommend sales or other specials. That way …

Hi, We are using the brooklyn theme which doesn’t offer a banner for the collection pages. Can you let us know if the information you provided would help us creating a full width banner on top of each collection page? Furthermore, if we needed editable text is this something that can easily be done…

Hi, I think that should be even easier that what I described. If you want the same banner to appear on every collections page, the collection-template.liquid file can be edited to include it. You can either make the banner an image and include a link to that image, or you could do it with code if i…

I’m using Brooklyn theme too and would like to add four clickable pictures in a banner type to the collection pages. If you could help me out I would appreciate it. Here is an example of what it would look like [Screen Shot 2020-12-13 at 3.21.30 PM.png]

Hi! I’ve been looking for a similar function for ages. I’m using Prestige theme and the collection-template file looks quite different. Would you be able to help me modify the code? Many thanks

I like this solution! However, do you have an updated draft for how to get it working on a 2.0 theme? thank you.

Thanks a lot for sharing this. This is exactly what I am looking for. Any idea where to put it in Dawn theme? Thanks

@Krass thanks a lot for sharing this. In Dawn theme, I am able to show the banner as 1 product but when I put medium-up—two-quarters, the banner still occupy only 1 product space. Any idea how to solve this ? Thanks

Sorry for jumping in here, but would you mind sharing where you added the code in Dawn theme?

Here is where you can add the code in Dawn theme: File name: main-collection-product-grid.liquid Just before this code: {%- endfor -%} {%- if paginate.pages > 1 -%} {% render 'pagination', paginate: paginate, anchor: '' %} {%- endif -%} {%- endif -%}…

Hi ya and how would you add the image to the page?

Trick to incorporate banners within collection pages

Store Design

vourlismenos February 27, 2025, 4:16pm 18

I’ve been trying to implement your solution in Dawn and even though I think I got everything correct, it doesn’t seem to be working.
Maybe something has changed?

Topic		Replies	Views
Dawn - how to add custom banners in product grid on collection page Store Design design , customizations , collection-page , css , shopify-themes , html	4	94	December 26, 2024
Adding banner ad amongst products on collection page Technical Q&A	18	395	February 14, 2025
Add banner in grid section within collection page Store Design	3	103	November 10, 2022
Adding Banner Image To Product Grid In Collection Template Store Design customizations	6	219	May 1, 2024
I want to know how to insert a banner in the collction product area Store Design design , customizations , collection-page , css , html	2	32	April 16, 2024

Trick to incorporate banners within collection pages

Related topics