[Resolved] Woocommerce gallery on the left

[Daniele]

I wanted to know if it is possibile to remove image links after this CSS is applied.

/* VERSION 1 - Vertical Scrolling Thumbnails */

.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: 420px) {
    .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;
        /* Adjust PX to suit width of thumbnails */
        max-height: 425px;
        /* Adjust Height to Image height on desktop */
        overflow: auto;
    }
    .woocommerce div.product div.images .flex-control-thumbs li {
        width: 100%;
        padding: 0 10px 10px 0;
    }
}

I’m trying this snippet of code:

add_filter(‘woocommerce_single_product_image_thumbnail_html’,’wc_remove_link_on_thumbnails’ );

function wc_remove_link_on_thumbnails( $html ) {
return strip_tags( $html,’‘ );
}
but I get this result: https://imgur.com/a/3DxT94L

thanks!

[Leo]

Hi there,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know 🙂

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

[Daniele]

The website is not public…let me see if I can push a copy on a dev server

[Leo]

Sounds good.

Let us know 🙂

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

[Daniele]

Here it is:

[Leo]

Try this CSS:

.woocommerce-product-gallery .flex-viewport {
    pointer-events: none;
}

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

[Daniele]

yes it could work

[Leo]

Glad to hear 🙂

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

[Author]

Posts