Re: product section width

BDPK · ‎12-18-2024

hi there

my store url is sundip1.myshopify.com and i have sticky side bar and its overlapping my products i need my products to be on right side

Dan-From-Ryviu · ‎12-18-2024

So please add this code to theme.liquid file after <head> in Online Store > Themes > Edit code
<style> @media (min-width: 750px) {
.index-section .grid--full {
max-width: calc(1220px - 330px);
float: right;
}
#shopify-section-footer {
width: 100%;
overflow: hidden;
}
}

</style>

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

View solution in original post

Dan-From-Ryviu · ‎12-18-2024

Hi @BDPK

Please add this code to Custom CSS in Online Store > Themes > Customize > Theme settings

@media (min-width: 750px) {
.index-section .grid--full {
    max-width: calc(1220px - 330px);
    float: right;
}
#shopify-section-footer {
    width: 100%;
    overflow: hidden;
}
}

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

BDPK · ‎12-18-2024

thanks for the solution but after putting this code it says

ONLINE STORE SESSION CANT BE PUBLISHED

Dan-From-Ryviu · ‎12-18-2024

So please add this code to theme.liquid file after <head> in Online Store > Themes > Edit code
<style> @media (min-width: 750px) {
.index-section .grid--full {
max-width: calc(1220px - 330px);
float: right;
}
#shopify-section-footer {
width: 100%;
overflow: hidden;
}
}

</style>

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

BDPK · ‎12-18-2024

BDPK · ‎12-18-2024

after adding given code my store seems like this