I have been scratching my head all day. I would like to add a custom checkbox within order review before placing order. Here is my code:
add_action( 'woocommerce_checkout_order_review', 'my_checkbox' );
function my_checkbox( $checkout ) {
echo '<div class="my_split_checkbox"><h2>' . __('Split Order', 'woocommerce') . '</h2>';
woocommerce_form_field( 'my_split_checkbox', array(
'type' => 'checkbox',
'class' => array('checkbox_field'),
'label' => __('Split Order', 'woocommerce'),
'required' => false,
), $checkout->get_value( 'my_split_checkbox' ));
echo '</div>';
}
but the page doesn't fully load. However if I replace the hook by
add_action( 'woocommerce_after_checkout_billing_form', 'my_checkbox' );
then the chekbox shows at the end of billing details with no issues. How can I get the textbox to show within checkout order review? Ideally after table .woocommerce-checkout-review-order-table.
You should use any of those below hooks instead of woocommerce_checkout_order_review to show the checkbox field based on your priority-
woocommerce_review_order_after_cart_contents
woocommerce_review_order_before_shipping
woocommerce_review_order_after_shipping
woocommerce_review_order_before_order_total
woocommerce_review_order_after_order_total
For further information go to woocommerce/templates/checkout/review-order.php. If you already copied the templates folder as woocommerce to your theme directory then may be you'll find the review-order.php there. And also you need to remove $checkout variable as well as , $checkout->get_value( 'my_split_checkbox' ). Cause those hooks do not pass any parameter. Please check the review-order.php, you'll get an overview.
So your whole code will be like below-
add_action( 'woocommerce_checkout_order_review', 'my_checkbox' );
function my_checkbox() {
echo '<div class="my_split_checkbox"><h2>' . __('Split Order', 'woocommerce') . '</h2>';
woocommerce_form_field( 'my_split_checkbox', array(
'type' => 'checkbox',
'class' => array('checkbox_field'),
'label' => __('Split Order', 'woocommerce'),
'required' => false,
));
echo '</div>';
}
Hope that helps.
Related
I simply don't understand what's happening. I have tried so many examples on stack overflow and not a single one, even when copied and pasted directly are working.
I'm trying to add custom fields to my checkout. This is working however no matter if I write manually into the text box or textarea or have javascript fill in the boxes the 'woocommerce_checkout_process' will always fail as if the box is empty and even if I pull that code out the order will have empty data where the field data should be stored. I have honestly tried every option I have located on the internet. This is infuriating as it seems to be working for everyone else. I don't know if this is a database security issue from my host that I'm unaware of, a bug in the latest version of WooCommerce, an issue with Divi. There have been no solutions, I'm genuinely hoping that someone knows something that I can't locate.
I have also tried with a single field in 'woocommerce_after_order_notes' still to no avail.
The code is as follows and was pulled directly from WC site, I've tried every modification I could find from other forums:
/**
* Add the field to the checkout
*/
add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
function my_custom_checkout_field( $checkout ) {
echo '<div id="my_custom_checkout_field"><h2>' . __('Wallet Info') . '</h2>';
woocommerce_form_field( 'checkbox_address', array(
'type' => 'checkbox',
'class' => array('my-field-class form-row-wide'),
'label' => __('I have a Wallet'),
), $checkout->get_value( 'checkbox_address' ));
woocommerce_form_field( 'address_field', array(
'type' => 'text',
'class' => array('my-field-class form-row-wide'),
'label' => __('Wallet Address'),
'placeholder' => __('000'),
), $checkout->get_value( 'address_field' ));
woocommerce_form_field( 'chosen_images', array(
'type' => 'textarea',
'class' => array('my-field-class form-row-wide'),
'label' => __('Chosen NFTs from above'),
), $checkout->get_value( 'chosen_images' ));
echo '</div>';
}
/**
* Process the checkout
*/
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function my_custom_checkout_field_process() {
// Check if set, if its not set add an error.
if ( ! $_POST['chosen_images'] )
wc_add_notice( __( 'Please enter something into this new shiny field.' ), 'error' );
}
/**
* Update the order meta with field value
*/
add_action( 'woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_order_meta' );
function my_custom_checkout_field_update_order_meta( $order_id ) {
if ( ! empty( $_POST['chosen_images'] ) ) {
update_post_meta( $order_id, 'chosen_images', sanitize_text_field( $_POST['chosen_images'] ) );
}
}
/**
* Display field value on the order edit page
*/
add_action( 'woocommerce_admin_order_data_after_billing_address', 'my_custom_checkout_field_display_admin_order_meta', 10, 1 );
function my_custom_checkout_field_display_admin_order_meta($order){
echo '<p><strong>'.__('chosen_images').':</strong> ' . get_post_meta( $order->id, 'chosen_images', true ) . '</p>';
}
Thanks in advance. I appreciate anyone who looks into this with me. Cheers!
You need to replace
update_post_meta( $order_id, 'chosen_images', sanitize_text_field( $_POST['chosen_images'] ) );
With
update_post_meta( $order_id, 'chosen_images', sanitize_textarea_field( $_POST['chosen_images'] ) );
sanitize_text_field() is used for type="text" not for texarea.
Full Updated Code
/**
* Add the field to the checkout
*/
add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
function my_custom_checkout_field( $checkout ) {
echo '<div id="my_custom_checkout_field"><h2>' . __('Wallet Info') . '</h2>';
woocommerce_form_field( 'checkbox_address', array(
'type' => 'checkbox',
'class' => array('my-field-class form-row-wide'),
'label' => __('I have a Wallet'),
), $checkout->get_value( 'checkbox_address' ));
woocommerce_form_field( 'address_field', array(
'type' => 'text',
'class' => array('my-field-class form-row-wide'),
'label' => __('Wallet Address'),
'placeholder' => __('000'),
), $checkout->get_value( 'address_field' ));
woocommerce_form_field( 'chosen_images', array(
'type' => 'textarea',
'class' => array('my-field-class form-row-wide'),
'label' => __('Chosen NFTs from above'),
), $checkout->get_value( 'chosen_images' ));
echo '</div>';
}
/**
* Process the checkout
*/
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function my_custom_checkout_field_process() {
// Check if set, if its not set add an error.
if ( ! $_POST['chosen_images'] )
wc_add_notice( __( 'Please enter something into this new shiny field.' ), 'error' );
}
/**
* Update the order meta with field value
*/
add_action( 'woocommerce_checkout_update_order_meta', 'my_custom_checkout_field_update_order_meta' );
function my_custom_checkout_field_update_order_meta( $order_id ) {
if ( ! empty( $_POST['chosen_images'] ) ) {
update_post_meta( $order_id, 'chosen_images', sanitize_textarea_field( $_POST['chosen_images'] ) );
}
}
/**
* Display field value on the order edit page
*/
add_action( 'woocommerce_admin_order_data_after_billing_address', 'my_custom_checkout_field_display_admin_order_meta', 10, 1 );
function my_custom_checkout_field_display_admin_order_meta($order){
echo '<p><strong>'.__('chosen_images').':</strong> ' . get_post_meta( $order->id, 'chosen_images', true ) . '</p>';
}
I'm trying to add this basic code to add a new field to the check out page. However, it seems to disable the place order button. Here is the code:
/**
* Add the field to the checkout
*/
add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
function my_custom_checkout_field( $checkout ) {
woocommerce_form_field( 'my_field_name', array(
'type' => 'text',
'class' => array('my-field-class form-row-wide'),
'label' => __('Were you assisted with this order?'),
'placeholder' => __('Please enter the name of your rep here'),
), $checkout->get_value( 'my_field_name' ));
echo '</div>';
}
You just need to remember to add the start echo'<div>' tag for your field options div. Otherwise it disables the woo-commerce functionality on the page.
add_action('woocommerce_after_order_notes','my_custom_checkout_field');
function my_custom_checkout_field( $checkout ) {
//need to remember echo start tag here!
echo '<div id="my_custom_checkout_field">';
woocommerce_form_field( 'name_of_child', array(
'type' => 'text',
'class' => array('my-field-class form-row-wide'),
'label' => __('Name of Child'),
'placeholder' => __('Enter something'),
), $checkout->get_value( 'name_of_child' ));
echo '</div>';
}
I use the following code to show date input on the checkout page, after additional information:
add_action( 'woocommerce_after_order_notes', 'custom_checkout_field' );
function custom_checkout_field( $checkout ) {
echo '<div id="custom_checkout_field"><h2>' . __('Date picker:') . '</h2>';
woocommerce_form_field(
'custom_field_name', array(
'type' => 'date',
'class' => array( 'my-field-class form-row-wide' ),
'label' => __( 'Custom Additional Field' ),
'placeholder' => __( 'New Custom Field' ),
),
$checkout->get_value( 'custom_field_name' )
);
echo '</div>';
}
But there is a problem with this code, all days are selectable, I am looking for a way to make previous days, and Sundays unclickable. Please give me some tips to solve this problem.
I went through Save and display specific payment gateway additional field everywhere in Woocommerce that displays an additional dropdown field for specific payment gateway in checkout page. But I need to show a text box instead of the drop down menu and save and show in orders, emails etc.
I have edit the code from the above link and made changes according to my ipg plugin, but it doesn't show.
add_filter( 'woocommerce_gateway_description', 'gateway_digitalipg_custom_fields', 20, 2 );
function gateway_digitalipg_custom_fields( $description, $payment_id ){
//
if( 'digitalipg' === $payment_id ){
ob_start(); // Start buffering
echo '<div class="digital-ipg" style="padding:10px 0;">';
woocommerce_form_field( 'digital-ipg', array(
'type' => 'select',
'label' => __("Fill in this field", "woocommerce"),
'class' => array('form-row-wide'),
'required' => true,
'options' => array(
'' => __("Select something", "woocommerce"),
'Option 1' => __("Choice one", "woocommerce"),
'Option 2' => __("Choice two", "woocommerce"),
),
), '');
echo '<div>';
$description .= ob_get_clean(); // Append buffered content
}
return $description;
}
the output was nothing i dont see any dropdowns on the cart when i select my ipg
I am working on an e-commerce website built in Woocommerce.
I want to add an extra field 'Delivery Date' in the billing form (in checkout page).
Here is the snapshot of the page:
I want to add 'Delivery Date' field next to Postcode.
The issue is that I can't find the location of this form.
I have looked everywhere in the Woocommerce Folder but couldn't find it.
My questions:
Where Woocommerce has located the billing form code?
And also: Do I just need to copy & paste the field? Or should I also add a field for it in Database?
I want the delivery date to be shown both in the dashboard and email.
You need to apply filters to add the woocommerce forms to checkhout. That's explained here in Lesson 2
https://docs.woothemes.com/document/tutorial-customising-checkout-fields-using-actions-and-filters/
/ Hook in
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
$fields['shipping']['shipping_phone'] = array(
'label' => __('Phone', 'woocommerce'),
'placeholder' => _x('Phone', 'placeholder', 'woocommerce'),
'required' => false,
'class' => array('form-row-wide'),
'clear' => true
);
return $fields;
}
/**
* Add the field to the checkout
*/
add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
function my_custom_checkout_field( $checkout ) {
echo '<div id="my_custom_checkout_field"><h2>' . __('My Field') . '</h2>';
woocommerce_form_field( 'my_field_name', array(
'type' => 'text',
'class' => array('my-field-class form-row-wide'),
'label' => __('Delivery Date'),
'placeholder' => __('Enter something'),
), $checkout->get_value( 'my_field_name' ));
echo '</div>';
}
Next we need to validate the field when the checkout form is posted. For this example the field is required and not optional:
/* Process the checkout*/
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function my_custom_checkout_field_process() {
// Check if set, if its not set add an error.
if ( ! $_POST['my_field_name'] )
wc_add_notice( __( 'Please enter something into this new shiny
field.' ), 'error' );
}