add to cart button sticky

[zelzis]

Hello Shopify Community,

I’m facing an issue with my eCommerce website, zelzis.com. On all product pages, the Add to Cart and Buy Now buttons are not sticky—they only appear when I scroll, but they don’t remain visible. However, on other pages, these buttons work as expected and remain sticky while scrolling.

I've attached screenshots showing the difference. Can someone please check and help me resolve this issue?

Thank you in advance for your assistance!

Best regards,

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @zelzis 
- Please follow these steps:

- Then find the theme.liquid file.
- Then add the following code at the before tag </head> and press 'Save' to save it.

 

<style>
@media only screen and (max-width: 600px) {
sticky-add-to-cart.productView-stickyCart.style-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
}
</style>

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[zelzis · Accepted solution]

hii 

your code is </head>paste but some issyu i want to our page in refresh to your button is show in header level sticky and some scroll to fotter level this are issyu faced i want to share screenshot

[BSS-TekLabs · Accepted solution]

<style>
@media only screen and (max-width: 600px) {
sticky-add-to-cart.productView-stickyCart.style-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
        top: auto !important;
        bottom: 64px !important;
}
}
</style>

Can you replace to this code @zelzis 

[zelzis · Accepted solution]

this code apply in head tag but not work i want to requested

i want to share some desktop connect option provide 

anydesk 

teamviewer

google meet 

you are intrested for our work

[BSS-TekLabs · Accepted solution]

You can private message me and share the teamview code with me.

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @zelzis 
- Please follow these steps:

- Then find the theme.liquid file.
- Then add the following code at the before tag </head> and press 'Save' to save it.

 

<style>
@media only screen and (max-width: 600px) {
sticky-add-to-cart.productView-stickyCart.style-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
}
</style>

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[zelzis · Accepted solution]

hii 

your code is </head>paste but some issyu i want to our page in refresh to your button is show in header level sticky and some scroll to fotter level this are issyu faced i want to share screenshot

[BSS-TekLabs · Accepted solution]

<style>
@media only screen and (max-width: 600px) {
sticky-add-to-cart.productView-stickyCart.style-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
        top: auto !important;
        bottom: 64px !important;
}
}
</style>

Can you replace to this code @zelzis 

[zelzis · Accepted solution]

this code apply in head tag but not work i want to requested

i want to share some desktop connect option provide 

anydesk 

teamviewer

google meet 

you are intrested for our work

[BSS-TekLabs · Accepted solution]

You can private message me and share the teamview code with me.

[zelzis · Accepted solution]

please share some guidelince how share in private message for you

[BSS-TekLabs]

<style>
@media only screen and (max-width: 600px) {
sticky-add-to-cart.productView-stickyCart.style-1 {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
        top: auto !important;
        bottom: 0px !important;
}
.product-details .product-option.sticky-product-mobile {
        display: none !important;
    }
}
</style>

Can you try thiss code @zelzis