Shopify themes, liquid, logos, and UX
Hi,
I'm wanting to move everything over a little bit to the left on my product pages.
This is so that it's more in the centre but still left aligned (text).
Here is the preview link:
https://bfpmmytfdcs7ysgl-27058765902.shopifypreview.com
Solved! Go to the solution
This is an accepted solution.
@thelunalee,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<style>@media (min-width: 750px){
.product-section .product {
padding-left: 100px;
}
}</style>
You can change the 100px to any value you wish. This will not take effect on mobile devices.
Kind regards,
Diego
This is an accepted solution.
Try this new code
Add code Your assets/section-main-product.css bottom of the file.
@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
.product {
margin: 0 auto;
justify-content: center;
}
}
This is an accepted solution.
@thelunalee,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<style>@media (min-width: 750px){
.product-section .product {
padding-left: 100px;
}
}</style>
You can change the 100px to any value you wish. This will not take effect on mobile devices.
Kind regards,
Diego
Amazing! Thank you!
Add code Your assets/section-main-product.css bottom of the file.
@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
product {
margin: 0 auto;
justify-content: center;
}
}
Thanks!
This is an accepted solution.
Try this new code
Add code Your assets/section-main-product.css bottom of the file.
@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
.product {
margin: 0 auto;
justify-content: center;
}
}
Thank you!
how to add padding to the entire left side?
Use This Code...
@media screen and (min-width: 990px) { .product:not(.product--no-media):not(.featured-product) .product_media-wrapper { max-width: 35% !important;} product { margin: 0 auto; justify-content: center; } }
Please share screenshot what do you want!
Thanks!
Hello could you help me?
Heated Jacket – WintertimeWonder
Password is 123.
I would like to make margins on the sides, as you can see it is right on the border.
Thanks
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024