Return to previous page

Coupon code on the checkout page needs to be bolder

This topic has 4 replies, 2 voices, and was last updated 1 months, 2 weeks ago ago by Rose Tyler

Monique

Participant

October 3, 2024 at 20:58

Can we make the “insert coupon code” bolder bigger on the checkout page so that our customers can visibly see it as it is very easy to miss it on the page.

Files is visible for topic creator and
support staff only.

#416993 Copied Theme version: 6.3.5 WooCommerce version: 9.2.3

3 Answers
Rose Tyler

Support staff

October 4, 2024 at 07:50
Hello, Monique,

Thank you for reaching out with your request. We understand the importance of making the “insert coupon code” option more visible on the checkout page.

Custom CSS code can be used, for example:
```
.woocommerce-form-coupon-toggle .woocommerce-info .showcoupon {
    font-weight: 900;
}
```
Best Regards,
8Theme’s Team
#417049 Copied
Monique

Participant

October 4, 2024 at 09:49

Thank you. Lastly instead of this been a drop down or click to view.. can it stay visible on the checkout page, so you don’t have to click on “click here to enter your code” It must already look like the screenshot I’ve attached.

Files is visible for topic creator and
support staff only.

#417079 Copied
Rose Tyler

Support staff

October 4, 2024 at 12:13
Hello, Monique,

Please try to change the previous code to:
```
.before-checkout-form .checkout_coupon {
    display: block !important;
}
.woocommerce-form-coupon-toggle .woocommerce-info .showcoupon {
    font-size: 0px;
}
```
Best Regards,
8Theme’s Team
#417135 Copied
Tagged: bold coupon code, coupon code highlight, improve visibility, user-friendly checkout, woocommerce themes, wordpress checkout
Viewing 4 results - 1 through 4 (of 4 total)