Can I make collection show product on full screen-district theme

Tourist
11 0 0

This is my website collection show products, it's obvious on both side have a large blank area.district collection.png

 

I want to make the collection product filling full wide. anyone can give me a ideal?

Thanks a lot.

Recommend collection.png

0 Likes
Shopify Expert
665 170 199

Hi, @Vicbr ,

This is Evita from On The Map.

 

Can you add your store URL?

 

Best, Evita

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes
Highlighted

Hello @Vicbr ,

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

.featured-collection .wrapper {
	max-width: 100% !important;
}

 

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
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
11 0 0

Hello Evita,

 

Thanks for your help. Here is my store url: https://www.uiisii.com/collections/bluetooth-headphones

Here is the second screenshot url:https://www.urbanears.com/jp/en/headphones/

0 Likes
Tourist
11 0 0

Here is the second screenshot store url:https://www.urbanears.com/jp/en/headphones/

0 Likes
Tourist
11 0 0

Hello,

 

Thanks for your help.

I paste this code to the theme.scss already, but it seems didn't work.

This is website url: https://www.uiisii.com/collections/wireless-earbuds

Here is I refer to the website url: https://www.urbanears.com/jp/en/headphones/

Can you give me more advice?

Thanks a lot!

0 Likes
Shopify Expert
665 170 199

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

 

 

.results-container {
   width: 100%!important;
  padding-left: 10px;
padding-right: 10px; }

I added the padding, so for the edges, there would be a little space, but you can adjust the px or remove the padding.

 

 

On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!
0 Likes