Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #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?

    #1308350

    Hi 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,
    Nikko

    #1308479

    Hi 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.

    #1308524

    Hi 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,
    Nikko

    #1308714

    Hi! 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!
    BR

    #1308856

    Hi,

    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,
    Rikard

    #1309050

    Hi!
    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!
    Br

    #1309181

    Hi,

    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

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.