I want a dji store ATC button style

[AA]

I would like to adjust the ADD TO CART on the product page as follows.
1. the default ADD TO CART button on the product page is hidden.
2. the new ADD TO CART button is fixed at the bottom of the page.

You can refer to the style of the DJI store, this is the effect I want to achieve.
https://store.dji.com/product/dji-mini-3-pro?vid=113961

• This topic was modified 2 years, 6 months ago by AA.

Attachments:

You must be logged in to view attached files.

[Luke Nielsen]

Hello,

1. In order to hide the default “add to cart” button, please enter the below code into the “Global Custom CSS” area that is in Theme Settings -> Custom CSS.

.single-product .summary-inner .cart {
    display: none;
}

2. The “Sticky add to cart” functionality can be activated via Theme Settings -> Single product -> Add to cart options -> turn on the “Sticky add to cart” option.

https://prnt.sc/jhy2WmEflnrp

If there’s anything else we can do, please get in touch.

Kind Regards

• This reply was modified 2 years, 6 months ago by Luke Nielsen.

Hi Team

Thanks for the support.
Unfortunately, this method did not meet my needs.

The ATC button inside the page is not properly hidden (I have set the CSS code as required).

Maybe I didn’t describe it clearly, but I want the ATC button on the page to MOVE to the bottom of the page, and the name of the button is always “Add To Cart”, not “Select options”.

You can notice that when the ATC button appears above the description, it also always shows “Add To Cart”; or you can simply look at store.dji.com’s ATC button, which I want to have the same effect as this one.

Hello,

1. Ok, I understood that you are using layout builder for the product page, in this case, the “Add to cart” button you can remove directly via the page builder.

https://gyazo.com/ca660d5e577cd31ccab2cf6272e74c92

2. The name of the button you can change with the help of the “Loco Translate” plugin.

Here is our documentation on how to use it:

https://xtemos.com/docs-topic/translate-woodmart-theme-with-loco-translate/

Also, the “Sticky add to cart” option display the button at the bottom just the way you need it.

https://gyazo.com/eed169a2cf7f3b17364f0c2e1f9a5513

Feel free to reach out so we can discuss possible options moving forward.

Kind Regards

[Author]

Posts