[Support request] Move coupon field in checkout (WooCommerce)

[Pedro]

Hello! I hope you are well.

I would like you to please help me with the following:

I would like to move the coupon field from before the billing information to before the order summary (on the checkout page)

If it is possible to show it as text, great!

I know it can be done by adding code in the functions.php file, but I do not know how to do it.

I hope you can help me, thanks!

GeneratePress 2.2.2

GP Premium 1.7.8

[David]

Hi there,

not 100% sure but give this PHP snippet a shot:

remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10 );
add_action( 'woocommerce_checkout_order_review', 'woocommerce_checkout_coupon_form', 5 );

https://docs.generatepress.com/article/adding-php/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david! Thanks for answering.

I placed the code in functions and effectively moved it.

However, now it shows the news asking for the coupon, and it also shows the coupon field, I would like this to be hidden.

Screenshot: https://www.dropbox.com/s/ey49181kgbf1px3/Captura%20de%20pantalla%20de%202019-02-26%2011-16-23.png?dl=0

I would also like that it did not have the news style, but that it was only text.

Ex: Have a coupon? LINK

[David]

Unfortunately by moving the coupon, it removes the necessary HTML required to trigger the toggle. That would take custom development which is out of our scope.

I can provide some CSS to hide the News Alert and style the “Si tienes un código de cupón, por favor, aplícalo abajo.” – let me know

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david!

I would like you to please help me with the CSS code, I would appreciate it.

[Tom]

Any chance you can move the coupon field back to where you want it? Hard to provide the necessary CSS with it up above the columns.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Pedro]

Hello Tom! Thanks for answering.

What I really want is to move the coupon field to another place that is not the beginning of the checkout.

Since what is achieved with this is to prevent customers from abandoning the purchase.

I hope you can help me, thanks.

[Tom]

Did the code David provide not move the field as you needed? Looks like you just need some CSS to remove the blue notice box?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Pedro]

Hello Tom!

Yes, I need to hide the blue block with CSS. You can help?

Thank you!

[David]

Hi there,

looks like you changed the checkout – i can’t see the blue notification? Let us know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Pedro]

Hello david! Sorry!

The checkout that I am using by default of WooCommerce is on the site: http://www.rebajaslocas.com

[David]

Try this CSS:

.woocommerce-form-coupon-toggle {
    display: none;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts