[Resolved] Change Single Product Image Layout

Home Forums Support Change Single Product Image Layout

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1249459
    Luciano

    Hi guys,

    I am using the Niche theme as my base theme for my site. The one thing I am not finding to be working for me is the single shop image layout. Since I am going to have a lot of images of one product the Niche theme will not work because there will be a lot of scrolling to get to the bottom; where the description, reviews, etc. are.

    Is there a way I can incorporate the style of the “Seller” them in your library?

    I mainly like the fact that it displays images below the main image as thumbnails. The Merch theme does something similar.

    Hope this makes sense. Thanks for the help!
    Luciano

    #1249988
    Leo
    Staff
    Customer Support

    Hi there,

    Can you go to Additional CSS field in the customizer and remove this block of CSS first?

    /* Stacked Gallery for desktop and sticky summary */
    
    @media (min-width: 768px) {
        .woocommerce-product-gallery {
            display: none;
        }
    
        .woo-sumamry-wrap {
            display: grid;
            grid-template-columns: 60% 40%;
            grid-template-rows: auto;
            margin-bottom: 80px;
        }
    
        .woo-gallery-stack {
            grid-column: 1;
            grid-row: 1 / 3;
        }
    
        .woo-gallery-stack img {
            margin-bottom: 20px;
        }
    
        .woocommerce-tabs {
            grid-column: 1;
        }
    
        .woocommerce div.product div.summary {
            grid-column: 2;
            grid-row: 1;
            margin-left: 20px;
            position: -webkit-sticky;
            position: sticky;
            top: 130px;
            bottom: 100px;
            padding-right: 35px;
        }
    
        .single-product span.onsale {
            position: absolute;
            top: 0;
        }
    }
    #1250020
    Luciano

    Thanks.

    I just removed it. Still shows two large images at the top of the product.

    #1250041
    Luciano

    I was able to figure it out I think. I disabled the Gallery Stack Element and it shows up correctly now.

    Thanks!

    #1250056
    Leo
    Staff
    Customer Support

    Glad you’ve figured out 🙂

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