Woocommerce: Coupon Box in a blog post WordPress
- SOLVED
Hi I would like to embed the coupon field in a blog post. The coupon field should be working and displaying a message if the code is wrong or good. Like the field in the cart.
Thank you,
Answers (3)
Rempty answers:
You need to do the next
Add this code to your functions.php
add_action( 'wp_ajax_rempty_coupon_page', 'rempty_coupon_page' );
add_action( 'wp_ajax_nopriv_rempty_coupon_page', 'rempty_coupon_page' );
function rempty_coupon_page() {
$code = $_REQUEST['coupon_code'];
if( empty( $code ) || !isset( $code ) ) {
$response = array(
'result' => 'error',
'message' => 'Code text field can not be empty.'
);
header( 'Content-Type: application/json' );
echo json_encode( $response );
exit();
}
$coupon = new WC_Coupon( $code );
if( !$coupon->is_valid() ) {
$response = array(
'result' => 'error',
'message' => 'Invalid code entered. Please try again.'
);
header( 'Content-Type: application/json' );
echo json_encode( $response );
exit();
} else {
global $woocommerce;
$woocommerce->cart->add_discount( $code );
$not=wc_get_notices();
$a="";
foreach($not as $n){
$a.=''.$n[0].'';
}
$response = array(
'result' => 'error',
'message' =>$a
);
header( 'Content-Type: application/json' );
echo json_encode( $response );
exit();
}
}
Add this javascript
jQuery( document ).ready( function() {
jQuery( '#ajax-coupon-redeem input[type="submit"]').click( function( ev ) {
var code = jQuery( 'input#coupon').val();
data = {
action: 'rempty_coupon_page',
coupon_code: code
};
jQuery.post( woocommerce_params.ajax_url, data, function( returned_data ) {
if( returned_data.result == 'error' ) {
jQuery( 'p.result' ).html( returned_data.message );
} else {
// Hijack the browser and redirect user to cart page
// window.location.href = returned_data.href;
}
});
ev.preventDefault();
});
});
And put this code where you want to show the coupon form
<div class="redeem-coupon">
<form id="ajax-coupon-redeem">
<p>
<input type="text" name="coupon" id="coupon"/>
<input type="submit" name="redeem-coupon" value="Redeem Offer" />
</p>
<p class="result"></p>
</form><!-- #ajax-coupon-redeem -->
</div><!-- .redeem-coupon -->
gorbatch comments:
Hi, Thank you for your answer !
Where should I put the javascript ? For the moment I put it in the header I edited the functions.php and created the post with the html but the form isnt working.
I sent you a pm with the demo page, thank you !!
Rempty comments:
Check if you copied all the code because the error is function was not found.
Check if copied
add_action( 'wp_ajax_rempty_coupon_page', 'rempty_coupon_page' );
add_action( 'wp_ajax_nopriv_rempty_coupon_page', 'rempty_coupon_page' );
to your functions.php
gorbatch comments:
Sorry I forgot a letter, but still nothing happened you can check the link I sent you by pm. I think the issue is with javascript.
Rempty comments:
there is no problem with javascript. the ajax petition is working, the problem is the php function was not found and show a 0 as response.
you must copy all the php code to your functions.php /wp-content/themes/jupiter-child/functions.php, or try /wp-content/themes/jupiter/functions.php
gorbatch comments:
thank you, the functions.php in the child theme wasnt enough I put it in /jupiter/ and it worked.
I awarded you the votes.
Thanks again