How to add coupon option to checkout

Hi there Jeremy,

I took a look at your site. After adding a product to the Cart and proceeding to the Checkout page, I saw an option to add a coupon as expected:

Link to image: https://d.pr/i/ulwHsH

Were you already able to resolve this? If so, then that’s great! Otherwise, please explain a bit more about how to reproduce the issue. Screenshots of what you are seeing could be helpful as well. I recommend https://snipboard.io for easily sharing screenshots – please follow the instructions on the page, then paste the URL in your reply here.

Hi @kellymetal,

Thanks for the response. After reading what you had to say, I played around a little more and here is what I noticed:

Originally there was a Cart page and a Checkout page. I felt it was kind of repetitive so I only wanted to display one of those pages.

On the Cart page (https://oddhand.com/cart/) there is a list of products in my cart with the ability to change quantities or delete the items entirely from the cart. But there is no option to enter a coupon.

On the Checkout page (https://oddhand.com/checkout/) there is the option to add a coupon, but you can’t edit what is in your cart.

Ideally, I would like to only have the Cart page, but with the option of adding a coupon. I’ve noticed that sometimes after doing things, you get redirected sometimes to the cart page and other times to the checkout page. So I think it would be best to have them identical, or completely get rid of one, if possible.

Please let me know if you can help with this.

Thanks,
Jeremy

Hi @kellymetal,

I was able to add the coupon the way I wanted to the cart page (https://oddhand.com/cart/) but I was wondering if you could please help me with two other tiny matters.

On that page, between the email address text box and the “Your order” text there is little space between the two. I would like to add more space. And near the bottom where it has two check boxes in the PayPal area, the boxes and text slightly overlap. Would you know how to fix that?

Thanks for everything,
Jeremy

Hi there Jeremy,

I was able to add the coupon the way I wanted to the cart page (https://oddhand.com/cart/)

Glad to hear you were able to get that set up the way you wanted!

between the email address text box and the “Your order” text there is little space between the two. I would like to add more space.

You could use some CSS to add more space there. This will add a bottom margin under the customer details section — you can change the number to add more/less space:

.woocommerce-checkout #customer_details {
  margin-bottom: 3em;
}

near the bottom where it has two check boxes in the PayPal area, the boxes and text slightly overlap. Would you know how to fix that?

There appears to be some styling from your theme that is causing the positioning of the checkboxes to be messed up — the following snippet should fix that:

.woocommerce form .form-row .input-checkbox.woocommerce-form__input-checkbox {
  position: relative;
}

I hope that helps!

Hi @kellymetal,

I love you! Thanks for all of your help. Everything you suggested fixed those minimal problems exactly as I wanted. You are the best!!!!

Thanks again,
Jeremy

Hi there Jeremy,

Haha, I’m glad to hear that did the trick! : )

I’m going to mark this thread as resolved. If you have any further questions, please start a new thread.

Have a wonderful day!