Liquid, JavaScript, themes, sales channels
I would like to try to make my website to be full width on the Home page, Collection pages and maybe product pages.
Let me know how.
Thanks.
https://bluerose-collections.com/
Hey
To make all pages full width you'd have to change the CSS code for the .page-width class in your CSS file.
Change this:
.page-width {
max-width: 1180px;
margin: 0 auto;
padding: 0 10px;
}
To this:
.page-width {
max-width: 100%;
margin: 0 auto;
padding: 0 10px;
}
I'd suggest duplicating your theme before making any changes in case something breaks or does not look as intended.
Let me know if you need more help.
Thanks,
Andre
Hi Andre.
This code works.
However it makes the items in the collection pages smaller on Mobile.
Any way to adjust this?
Thanks.
Hey
Please go to the same file and paste this code at the bottom and let me know if it works:
@media only screen and (max-width: 600px) {
.page-width {
max-width: 100%;
}
}
This code should only affect the mobile version of the website.
Let me know if that works and if you are satisfied with the results.
Thanks,
Andre
It works good for desktop.
Bu it still makes all the pictures and products too small
User | RANK |
---|---|
21 | |
20 | |
13 | |
12 | |
8 |
Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023One of the key components to running a successful online business is having clear and co...
By Ollie Mar 6, 2023