Fix Product Gallery At Window When Scrolling

[Floow]

HI Harry,

Is there a quick way to fixate the gallery at the top of the page while scrolling? Similar to Amazon.de “https://www.amazon.de/dp/B07VWV4MM9/” (make screen small so the text will get displayed very long and then scroll)

Or is this javascript and complicated?

 

Thank you,

Florian

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Please copy file layout-1.php from claue > core > libraries > vendors > woocommerce > templates > extras > single to claue-child > woocommerce > extras > single

and add class to line 59 “jas-sidebar-sticky”

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Floow]

Hi Harry,

 

Thank you.

 

Did it but it doesn’t get displayed properly: see here: https://www.fashionchingu.com/upstroke/kpop-fashion/itzy-fashion/black-one-piece-jumpsuit-chaeryeong-itzy/

Also tried it without any additional CSS

Login credentials same as previous mentioned.

 

Thank you.

[Harry]

Hi,

I changed code it now ok.

Regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Floow]

Hi Harry I got it that the main picture is now sticky and the gallery next to it as well. But the sticky part is set on the height of the main picture – so when the visitor scrools down and a picture has not the height as the gallery at the left side has, then, the gallery on the left side lays over the content below.

 

Just ignore the errors in the screenshot – these are from elsewhere.

Attachments:

You must be logged in to view attached files.

[Harry]

Hi Florian,

Please copy file product-image.php from claue > core > libraries > vendors > woocommerce > templates > single-product to claue-child > woocommerce > single-product and remove code

"adaptiveHeight":true,

in line 46

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Floow]

Worked greatly.

 

Now can we a quick CSS to vertically align the picture in the center?

Thank you.

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

I’m sorry it auto get height base on product image height so can’t vertical image to middle.

Kind regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts