Elementor with WooCommerce Sticky Add To Cart Bottom Bar - No Code or Plugins Needed!

✨ Join us in the Lytbox Academy Community:

Adding a Sticky Add To Cart bottom bar on your product pages will increase sales and conversions. Here is a simple way to add this will Elementor.

My goal is to create a community for Web Designers, Developers, Freelancers, and Elementor enthusiasts to learn the design & business side of creating websites.

/////

✨ Learn High-Level Web Design Skills With Me:

🟢 Master Elementor while learning web design skills:

🟢 Learn powerful SEO in an easy-to-follow style for WordPress users and web designers:

🟢 A step-by-step guide to building a WordPress Maintenance Business that results in high MRR:

🟢 Become a Lytbox Academy Pro Member:

/////

✨ My Recommended WordPress & Web Design Tools:

👉 The hosting I use:

Cloudways (use promo code LYTBOX for 30% off 3/months)
xCloud:

/////

👉 My WordPress Tools:

Elementor Pro:
Breakdance Builder:
Bricks Builder:
Crocoblock:
SEOPress (the best SEO tool for WordPress!):
Perfmatters:
InstaWP:
WP Umbrella:

/////

Thank you for supporting my channel 🙏 - Jeffrey @ Lytbox

#elementorstickybottombar #woocommercestickyaddtocartbottombar

[LytboxStudio]

In this tutorial, I went a bit faster, left out the styling and focused more in the functionality. What do you think, should I go more into details on the styling with Elementor or make shorter and more to the point?

[lifechangingwords]

Great video. The way you made it works well for simple products but not variable products. is there a way to customize it even further for variable products?

[munirshah]

I did the same functionality in a recent project using CSS, but this video really helps me. Thanks.

[damianmigaa]

Bro, amazing. I want more content with woocommerce and elementor! Greets

[arturo]

Hello, thanks fot the video. I have a question, How can we Exit de pop ub when we go up in the page? The Button still there when we move up? Thanks PD: I dont know if we can do that in the settings or need some CCS code or JS

[dawoodhamayun]

Love Your Videos!!!!

One request could you make a speed art video in which you design a detailed Single Product template for WooCommerce. For example, you can remake the one you are using in this video with all the toggle FAQ and other details you used inside.

[chunkitkuo]

Could we have a tutorial for this sticky add-to-cart bar but for variable product + ajax add to cart? Appreciate it !!

[carlomontana]

Amazing!! I was looking for a similar thing for a couple days now. Thank you very much!

[adrian.or.]

Please do more videos with woocomerce :)
Thanks!

[jadehill-thomson]

Great video, but how do you make the pop-up disappear when the user scrolls back to the top?

[NVMarketingPacificPines]

Hey there, great video. Though how do we get to work with variable products? At the moment, I can get it to show the variations, but it won't let me select one or add it to cart.

[StudioInnate]

Thanks for the video Jeff. is there a way of doing this with product variables, ideally with the preselected variable that you can set on the product variables tab in the product backend? Thanks in advance

[akvstudios]

Awesome Video! For me, It works perfectly on Desktop! For mobile however, works, but stretches the page past the footer and shows at the bottom of the page with some white space in between. Could use some help. Thanks!

[thassiopaganucci]

Wonderful video! Thank you! In my store, we have products with variations and in this specific kind it does not work well (when you click on add to cart, it just reload the page and do nothing). Would you know a way out of this problem? Thank you so much!

[carolinaortegax]

Great video! What plug in or Elementor feature did you use to create your actual shopping cart? I like how the shopping cart icon sticks to the top of the page and doesn’t move or disappear and is always accessible to the customer. Once you clicked it, I really liked how the shopping cart popped up on the side like that. Thanks for the awesome video!

[MikaNL]

really helpful and good put together!!

[luxmediq]

Great tutorial! Have you succeeded in making the sticky cart button work with products with variations as well?

[Anomaliayt]

Thanks! Although once it's up, you can't click on any other add to cart button on the screen, and this doesn't seem to work with variable products. At least for me. I just want a simple 'add to cart' button stickied at the bottom which will put the default variation in cart. The page either refreshes with nothing added, or if I try another plug in, it forces the options, and even if I choose, it askes me to choose option/variation on product page.

[klitos]

Thank you for your beautiful tutorials! The title widget that draws dynamically the product price does not work for Variable products. When I press "add to cart button" it reloads the page, even if I had selected one variation at the beginning. Is there any way to correct this?

[arturo]

Can you add like a padding so looks like its floating in the page?