Product Page Scrolling Effect Setup
-
Hello,
I want to set up my website to have the same scrolling effect on the product image section of the product page as this demo website: https://woodmart.xtemos.com/perfumes/product/abyss-bleu-2ml-sample/. Currently, my website scrolls entirely when the mouse is scrolled, and I want to apply the same scrolling effect used for the images on this demo website to the right half of my site. I don’t know the official name for this effect, and I’m not sure if my explanation is clear to you.
Attachments:
You must be
logged in to view attached files.
Hello,
If you are using the default layout of the theme for the single product page, then you can turn ON the “Sticky Product” from Theme Settings >> Single Product: https://postimg.cc/23yHbjqF
If you are using custom layouts for a single product page, which is built with the WoodMart WooCommerce builder. Navigate to Layouts > select Container widget > Advanced tab > and turn on the Sticky container option. https://ibb.co/ks3V80Qz
Further, you can read more about the Layout Builder here: https://xtemos.com/docs-topic/woodmart-woocommerce-layout-builder/
Best Regards,
Hello,
I’ve been working on a page using the Gutenberg editor, but I can’t find the sticky container setting shown in your screenshot. Would you be able to log in using the WordPress admin login details I’ve provided and take a look for me?
Hello,
For Gutenberg, I have edited your Custom Single Product Page layout. I updated the column that contains the featured image and enabled the Sticky option for it.
Please refer to this screenshot for reference: https://postimg.cc/dDdxzMHH
You can now check the result on your product page here:
https://hanfutale.com/song-dynasty-hanfu-lotus-pattern-dress/
Best Regards,
.
