Archived topic
It's possible to make the woocommerce product page as this webpage?
3 replies · Started by Richard on January 14, 2019
Hello guys,
I want to make my e-commerce shop like this: https://www.schmeck.com/usd/product/schmeck-shirt-burgundy/
Where it have a sticky sidebar (with product info) and the images are all visible without thumbnails.
Hi there,
unfortunately that would require some heavy custom coding, particularly the stacked product images.
Ok! Thank you for your reply
OK, had a little play - its not 100% alike ie. no hover zoom but something you can have a go at - not much more we can do in this forum though:
1. Add the following PHP:
add_filter( 'woocommerce_gallery_thumbnail_size', function( $size ) {
return 'large';
} );
https://docs.generatepress.com/article/adding-css/
2. Add this CSS:
@media (min-width: 768px) {
.woocommerce div.product div.images .flex-control-thumbs li {
width: 100%;
padding: 0 !important;
margin: 0.5em 0;
}
.woocommerce-page div.product div.summary {
position: -webkit-sticky;
position: sticky;
top: 60px; /* adjust for sticky navigation - if not set to zero */
}
}