Dawn Theme Product page Add to cart button overlapping issue

Solved

Dawn Theme Product page Add to cart button overlapping issue

Sivadarshan
Shopify Partner
229 1 32

I'm using dawn theme latest version in that product page, Add to cart i done some customization like quantity selector and Add to cart was in same line, it was working good, but there are some issues like when I add more quantities like eg 10pcs then the error message overlaps the add to cart button and in popup notification when product was put in add to cart at that time buttons are overlapped, I'll share the images and website for reference. how to solve this issue.

 

The Design I want is this

Screenshot 2024-12-02 175332.png

 

The error when more quantities are added

Screenshot 2024-12-02 175357.png

 

Popup when product is add to cart

Screenshot 2024-12-02 180820.png

 

 

Website : https://mannavan.myshopify.com/

Password: offnorth

Accepted Solution (1)
DaisyVo
Shopify Partner
2848 343 401

This is an accepted solution.

@Sivadarshan 

You can find this code in buy-buttons.liquid: https://prnt.sc/0RusO5Z8WgG0

You put that code below the form and it will display below the buy it now button: https://prnt.sc/2_ziDF7-iHqg

I hope it can help you!

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution

View solution in original post

Replies 7 (7)

steve_michael2
Trailblazer
441 38 55

Hi
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.css / based.css file and paste the code in the bottom of the file


steve_michael2_0-1733144221061.png

 

 

.product-form__error-message-wrapper {
    display: none !important;
}

 

 
Thanks!

 

Sivadarshan
Shopify Partner
229 1 32

@steve_michael2  Thanks! But this will entirely hide the error message, I need the error message to placed under buy now buttons

DaisyVo
Shopify Partner
2848 343 401

Hi @Sivadarshan ,

 

You can change this message to under the buy now button: https://prnt.sc/2TygOUhXTjn3

This way it won't change your buttons.

If you agree we can help you fix it

 

Best regards,

Daisy

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution
Sivadarshan
Shopify Partner
229 1 32

@DaisyVo Thanks for this! Where to find this line in code editor? (Which file), whether it works for mobile too....

DaisyVo
Shopify Partner
2848 343 401

Can you share edit code permission for me?

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution
Sivadarshan
Shopify Partner
229 1 32

@DaisyVo  Don't take it has mistake, I'm newbie shopify developer, so I want to learn more regarding shopify, if you guide me rather than making changes by yourself will be very useful. If it doesn't work i'll provide you the access. 

DaisyVo
Shopify Partner
2848 343 401

This is an accepted solution.

@Sivadarshan 

You can find this code in buy-buttons.liquid: https://prnt.sc/0RusO5Z8WgG0

You put that code below the form and it will display below the buy it now button: https://prnt.sc/2_ziDF7-iHqg

I hope it can help you!

Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution