I would like to make an element sticky in product page

[noosathletics]

Hi,

I would like to make the product image sticky in the product page. Also, the image does not render well as it is too big, do you have any advice on that as well?

I also have a video which does not autoplay if I put it as the first media, only when you click/scroll along.

Thanks!

[DaisyVo]

Hi @noosathletics 

Thank you for reaching out to the Shopify community. I'd be glad to assist you. Could you kindly share your store URL and password (if it’s password-protected) so I can review it and provide you with an update?

[noosathletics]

Hi DaisyVo

www.noosathletics.com

B2Bridge

Thank you!

[B2Bridge]

Hi @noosathletics 
Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

[noosathletics]

Hi B2Bridge!

www.noosathletics.com

B2Bridge

Thanks!

[B2Bridge · Accepted solution]

Hi @noosathletics ,

You can follow our instructions below:
1/ Shopify admin > Online store > Edit code
2/ Search for "theme.liquid" file
3/ Open the file and search for </head> tag and add the following code above </head> tag

{% style %}
@media screen and (min-width: 1000px) {
.product-gallery.product-gallery--desktop-carousel
{
    position: sticky !important;
    top: 160px !important;
    max-width: 80% !important;
    margin: 0 auto !important;
}
}
{% endstyle %}

this is result 

If this helpful, please give us a like and mark its as a solution. Thanks you 😍

[noosathletics]

That definitely worked! Do you also have a solution for the autoplay of the video if i'd put that as a first picture?
In addition, could you help me achieving what the following merchant has done: https://upfront.nl/collections/alles

In the overview you see the beginning of the video, and when your cursor crosses the product the video starts playing as well.

Thanks!