[Support request] product thumbnails

[Bilal]

Hello,

How can I make the horizontal Thumbnails on the product pages.

Please help.

Thank you

GeneratePress 2.2.2

GP Premium 1.7.8

[David]

Hi there,

you have this CSS, probably in Customizer > Additional CSS:

.woocommerce div.product div.images .flex-control-thumbs li {
    padding: 5px 5px 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

@media (min-width:460px) {
    .woocommerce-page div.product div.images {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-item-align: center;
        align-self: center
    }

    .woocommerce div.product div.images .flex-control-thumbs {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-flex: 1;
        -ms-flex: 1 0 80px;
        flex: 1 0 80px;
        max-height: 340px;
        overflow: auto
    }

    .woocommerce div.product div.images .flex-control-thumbs li {
        width: 100%;
        padding: 0 10px 10px 0
    }
}

.woocommerce div.product div.images .flex-control-thumbs li {
    padding: 5px 5px 0 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -ms-flex: 1 0 25%;
    flex: 1 0 25%
}

.woocommerce div.product div.images .flex-control-thumbs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: auto
}

Remove that and they will default to the normal row under the image

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Bilal]

Hello David,

After download the GP Premium Version 1.8.0. and product “Tabs” size becoming to smaller. How can I make tabs a little more line height?

Thank you

[David]

This CSS:

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    line-height: 2.5em;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts