SOLVED: Woocommerce Notice element not working on Checkout Template

Bugs
21

I am still anxiously waiting for a solution for the placement of coupon form and login form at checkout page. It’s a much-needed function.

22

Is there any news on this yet?

23

The task is still in progress, but there is now a separate report on it: WIP: WooCommerce Coupon/Returning Customer Notice Outside of Notice Element - #2 by timmse

24

Try this fix in the bricks settings >> custom code >> custom css for the coupon code to style it better. You may need to set the width and margin to suite your needs. See the comments in the code.

/*----- START Checkout -- Enter Coupon Code -----*/
.brxe-container.before-checkout {
    /* 
     *    Set this width (or max-width) equal to your theme  
     *    container width + theme section left & right margins.
     */
    width: 1260px;
} 

.brxe-container.before-checkout .woocommerce-info {
    font-family: Inter;
    /* 
     *    Set left & right margins the same as your theme 
     *    section left & right margins.
     */
    margin: 20px 30px 0 30px;
}

@media (max-width: 478px) {
    .brxe-container.before-checkout .woocommerce-info {
        /* 
         *    Set left & right margins the same as your theme 
         *    section left & right margins.
         */
        margin: 20px 10px 0 10px;
    }
}

.woocommerce-checkout form.checkout_coupon {
    /* 
     *    Set left & right margins the same as your theme 
     *    section left & right margins.
     */
    margin: 30px 30px;
}

@media (max-width: 478px) {
    .woocommerce-checkout form.checkout_coupon {
        /* 
         *    Set left & right margins the same as your theme 
         *    section left & right margins.
         */
        margin: 30px 10px;
    }
}

@media (max-width: 991px) {
    .brxe-container.before-checkout .woocommerce-form-coupon .form-row-first {
        margin-bottom: 10px;
    }
}

/*----- END Checkout -- Enter Coupon Code -----*/

This is from the Easy Bricks Builder WooCommerce Template Kit v1.1.15.

25

Is there an ETA on getting the coupon thing fixed? I’m new to Bricks but I see this issue is 10+ months old now. My checkout pages look terrible as a result of this bug.

1 Like
26

This coupon issue needs to be fixed asap. the checkout page looks so bad !

2 Likes
27

I’d like to chime in that this issue is still present on v2.1.4 @timmse

image
image1552×765 108 KB

1 Like
28

Hi Carl,
I would ask you to create a new report, as this thread is ancient and contains multiple issues, making it difficult to understand what it is actually about.

Before you create a new report, please disable any additional third-party payment plugins and check whether the notice still doesn’t work as expected, as these can cause issues (especially with the notice element).

29

Hey! I couldn’t read the full thread, but here’s the method I’ve been using to move WooCommerce notices to custom positions on the Cart.

Cart Page Notice Position

Add a block element anywhere you want the Woo notices to appear and give it this class:

.woo-notice-holder

Then add this script (via Code Block, custom JS, or the page):

<script type="text/javascript">
jQuery(document).ready(function($) {
    $('.woocommerce-notices-wrapper').appendTo('.woo-notice-holder');
});
</script>

This will move all WooCommerce notices inside .woo-notice-holder on the Cart page.

1 Like