How can I add a sticky cart button to Dawn Theme V10?

Store Design
,

Topic summary

A user seeks to add a sticky add-to-cart button at the bottom of product pages on Dawn Theme V10.

Initial Solution:

  • A contributor provides custom liquid code to be added via Customize > Products > Default product > Add block > Custom liquid.
  • The first attempt results in a transparent, non-clickable button.

Working Fix:

  • After troubleshooting, code is added to the main-product.liquid file (bottom of file), which resolves the transparency and clickability issues.
  • The original poster confirms success but asks about triggering the sticky behavior only after scrolling past the original button—this is noted as complex to implement without detailed debugging.

Additional Requests:

  • Other users ask how to customize button color and add borders; responses suggest sharing site links for specific guidance.
  • One user reports the solution works on Dawn v11.0.

Alternative Solutions:

  • Multiple participants recommend free Shopify apps (Pasilobus Sticky Cart, Essential Sticky Add to Cart, ThemeStack) and YouTube tutorials as code-free alternatives.

Status: The core issue is resolved with custom code, though advanced customization (scroll triggers, styling) requires further technical work or app-based solutions.

Summarized with AI on October 24. AI used: claude-sonnet-4-5-20250929.
1

Hello! I want to have a sticky add to cart button (at the bottom) on my productpage. Can anyone help me! I have Dawn Theme V10

2

Hi @Sabrii2 ,

Please go to Customize > Products > Default product > Add block > Custom liquid and add code here:

Screenshot.png
Screenshot.png426×904 17.4 KB

Code:

Hope it helps!

3

Thanks Namphan! Unfortunately it is not working! The button is not clickable, it is also transparant.

4

Hi @Sabrii2 ,

Please send your site. I will check it.

5

Thank you! www.belloti.nl

6

@Sabrii2

Please check the following video

7

Hi @Sabrii2 ,

Please go to Actions > Edit code > main-product.liquid file and paste this at the bottom of the file:
2 Likes
8

Thank you! Not transparant anymore! But still not clickable.

9

Hi @Sabrii2 ,

Can you re-add it and send me the preview link? I will check it again

10

Dear Namphan,
It works! Thank you very much! Can i adjust the moment that the button sticks. For example after scrolling down when the add to cart button is not more in sight?

Greetss

1 Like
11

Hi @Sabrii2 ,

This will take many steps and debug, so it is difficult for me to guide you in detail.

Hope it is clear to you.

12

@namphan We recently released a sticky cart app with a free plan. It works with all themes including Dawn, check it out:https://apps.shopify.com/pasilobus-sticky-cart

13

Hi, this is really helpful, thank you! I want to change the color of the button and add a black border, if possible. Would you kindly let me know how I can do that? Could I add some more code here to configure the color? Thanks in advance!

14

Hi @AsiyaM ,

Can you send me the site link? I will check it in detail

15

Sure! It’s Crescentt.com

16

Hi @AsiyaM ,

I don’t find the code you added and the sticky button, can you add it and send me the preview link?

17

This worked perfectly for my shop, Dawn v11.0

1 Like
18

Hi @Gil-Momo ,

If you have any questions, you can contact me. Happy to help you

19

Hi,

How can I change the colour of the button? I used your code and the button is currently in black. could you tell me how to change it color?

Thanks,

Gil

20

You can add sticky add to cart: