Tagged: boxed layout, Single Product Pages
-
AuthorPosts
-
June 30, 2021 at 12:11 pm #1308097
Hi!
I’m using full width layout, but would like to use a boxed layout on every single product page. I want it to look like this:
Baby Leo Sara Short Sleeve Swimsuit(Where the content is centered and there is some white spaces on both sides).
How do I do this for all my single product pages?
July 1, 2021 at 5:08 pm #1308350Hi AnniNilsson,
Can you give us a link to one of your single product page? so we can inspect it and give you an accurate CSS code.
Best regards,
NikkoJuly 2, 2021 at 10:09 am #1308479Hi Nikko! Thanks for your respond!
Unfortunately it’s in maintenance mode. But it would be great if you had a code that made every one of my single product page to a boxed layout or at least gave the pages some more white space on the sides (except on mobile view- I like how it looks in mobile view right now).I’m using Woocommerce.
July 2, 2021 at 4:09 pm #1308524Hi AnniNilsson,
Please try adding this CSS code in Enfold > General Styling > Quick CSS:
#top .single-product-main-image { width: 48%; margin-right: 4%; } #top .single-product-summary { width: 48%; }
Best regards,
NikkoJuly 5, 2021 at 8:27 am #1308714Hi! Thanks for you help!
Unfortunately it doesn’t work.. Shows double pictures instead. Tried this code:#top .single-product-main-image {
margin-left: 10%;
}#top .single-product-summary {
width: 48%;
}Which kinda was what I was looking for the magnifier on the picture won’t move. And, this is just the gallery and text that moves, not the “You might also like..” underneath it. And I don’t it to have white space on the sides in mobile view.
Is there not a way to just add some padding to the sides on the WHOLE page, not just specifik columns?
Thanks again for helping me!
BRJuly 6, 2021 at 4:14 am #1308856Hi,
Thanks for the update. It would help if we could see the results you are getting on your actual site. If the site is in maintenance mode, then please create a temporary user, and post the login details in private. That way we can access the site.
Best regards,
RikardJuly 7, 2021 at 8:25 am #1309050Hi!
Posted a link to the page in private content.
This is just one product page, and the code I’m looking for should change the layout of every single product page.
Hope there is a way to fix this.
Thank you!
BrJuly 8, 2021 at 4:03 am #1309181Hi,
Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:
.single-product .container_wrap { max-width: 80% !important; display: table; margin: 0 auto; } .single-product .avia-section .container { max-width: 80% !important; }
If that is not what you are looking to achieve, then please post a screenshot highlighting your intentions in greater detail.
Best regards,
Rikard -
AuthorPosts
- You must be logged in to reply to this topic.