Debut theme, collection page, Resize the images

Solved
Lilas-addas
Excursionist
44 0 7

Hello,

The images in my collection page are too small and I want to make theme bigger to fill all the page area  as the photos attached.

Is there any way to do that? A help would be very appreciated!

My URL: https://presets-market.com/collections/all

3.jpg2.jpg

0 Likes

This is an accepted solution.

Hello @Lilas-addas,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.template-collection .page-width {
	max-width: 100%;
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
Lilas-addas
Excursionist
44 0 7

Thank you so much! 

Can I do the same on the mobile view ? and make the width 100% ?

(Showing one product in the mobile width as now it appears two products!)

 

0 Likes

This is an accepted solution.

@Lilas-addas,

For that

1. Go to Online Store->Theme->Edit code
2. Sections->collection-template.liquid

2020-02-03_17-51.jpg

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
SPILLEDMILK
New Member
3 0 0

I'm looking to do something similar except the margin between each product on the collection page is too large creating a lot of white space around the image. Looking to shrink that if anyone can help get this done?  I am looking for something with spacing like this: https://www.notre-shop.com/collections/new-arrivals

 

Thanks in advance!

Screen Shot 2020-06-24 at 4.48.59 PM.png

0 Likes
invisiblecity
New Member
5 0 0

Hey this worked great for the actual Collection Pages, but is there any way to do the same thing on the Home Page, but just to the Featured Collection Sections? I have found the line of code under Sizing Variables to change the entire theme width from 1200px to just auto, but I found that anything that wasn't a Featured Collection Section was too spaced out. 

Here is my site for reference:

https://invisiblecityeditions.com/

Thanks!

0 Likes
Chero
Tourist
7 0 3

Hello @SPILLEDMILK ,

i have two question.

1- how did you manage to reduce the space in between the picture?

2- what was the way to get through for your hover effect?

thanks in advance

 

 

0 Likes
kloader
New Member
4 0 0

Hi, i'm have the same problem not being able to enlarge all product images at once at https://shop-brenda-beddome.myshopify.com/collections/2021-spring-summer-collection

I tried your deleting part of assign grid, nothing happened. I included a copy of the free debut collection-template.liquid. Maybe could help?

Thank you

Kevin

kloader_0-1612449772395.png

 

0 Likes
phosphenestudio
New Member
1 0 0

Hi there! We are adding this copy paste like instructed but it's not working Has the theme updated? Help please!

0 Likes