Debut Theme - Sticky Add to Cart on Bottom Always (Only Mobile)

sklads94
New Member
2 0 1

Hi.

 

I would like to know how to Sticky Add to Cart on Bottom Always on product page. I want it only for mobile version.

This is how I want my website add to cart button to be : https://www.houseofindya.com/pink-embroidered-mesh-maxi-skirt-with-can-can-199/iprdt?intcmp=hp,4,3,,...

 

Please look this website on mobile version and you will notice that there is a yellow button of "Add to Bag" which is constantly sticky at the bottom. Please help me regarding this. 

 

Also, please guide me whether Debut theme would be best suited or Minimal / Brooklyn / Simple?

 

Thanks a lot.

Replies 10 (10)
KetanKumar
Shopify Partner
24923 2498 9040

Hello, @sklads94 

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
sklads94
New Member
2 0 1

I am yet to make my website. I am still contemplating on what would be perfect theme that provides the above mentioned solution.

KetanKumar
Shopify Partner
24923 2498 9040

@sklads94 

It can be done by doing some code customization. Please take the help of a developer and hire Shopify Expert or me

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
Kumar2573
Pathfinder
99 5 11

//sticky add to cart on product page
$(document).ready(function(){
var txt = $(".template-product .product-form__cart-submit span").text();
$(".button_click_cart").text(txt);
$(".button_click_cart").click(function(){
$(".template-product .product-form__cart-submit").trigger("click");
});
var y = $(document).scrollTop();
if (y > 450) {
$('.button_click_cart').addClass("visibleme");
} else {
$('.button_click_cart').removeClass("visibleme");
}
});
$(document).scroll(function() {
var y = $(this).scrollTop();
if (y > 450) {
$('.button_click_cart').addClass("visibleme");
} else {
$('.button_click_cart').removeClass("visibleme");
}
});

Expert Shopify Plus & shopify Developer & Theme customizer
- If the problem is solved remember to click ✅ to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- jitendra3496@gmail.com | Skype :- jitendra2573_1
- Direct Hire me :- Direct Contact me
Kocktail
New Member
1 0 0

Where do you put this code?

Rebekka
New Member
2 0 0

Where do you place this code?

Kumar2573
Pathfinder
99 5 11

you can placed the code before </body> close.

Expert Shopify Plus & shopify Developer & Theme customizer
- If the problem is solved remember to click ✅ to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- jitendra3496@gmail.com | Skype :- jitendra2573_1
- Direct Hire me :- Direct Contact me
Rebekka
New Member
2 0 0

What file do you place the code? it is not working with the theme. thank you.

Kumar2573
Pathfinder
99 5 11

Plz send contract so that we can add the code in your store.

My email id jitendra3496@gmail.com

Expert Shopify Plus & shopify Developer & Theme customizer
- If the problem is solved remember to click ✅ to Accept Solution
- Press Like ?? if the answer was helpful
- Still, Facing issue, Reach out to me Email :- jitendra3496@gmail.com | Skype :- jitendra2573_1
- Direct Hire me :- Direct Contact me