I have the nex version of woocommerce 2.2.4.
I want creat a new field in the order for display the total weight, i try this :
add_action('woocommerce_after_order_notes', 'my_custom_checkout_field');
function my_custom_checkout_field( $checkout ) {
global $woocommerce;
echo '<div id="my_custom_checkout_field"><h3>'.$weight = $woocommerce->cart->cart_contents_weight+1.100, ' Kg</h3>';
woocommerce_form_field( 'my_field_name', array(
'type' => '',
'class' => array('my-field-class orm-row-wide'),
'label' => __('Fill in this field'),
'placeholder' => $weight,
), $checkout->get_value( 'my_field_name' ));
echo '</div>';
}
add_action('woocommerce_checkout_update_order_meta', 'custom_checkout_field_update_order_meta');
function custom_checkout_field_update_order_meta( $order_id ) {
if ($_POST['my_field_name']) update_post_meta( $order_id, 'weight', esc_attr($_POST['my_field_name']));
}
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>'.__('weight').':</strong> ' . $order->order_custom_fields['weight'][0] . '</p>';
}
My div display corectly the weight but is not save in the order?
Where the problem?
Thank's
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>';
}
Could anyone assist in helping me get the below code to function correctly. I have taken bits of code from various other posts to create it.
I need to create a custom field (Datasheet) and be able to post a link to a PDF file. It should then appear just before the meta data on each product page.
Current code is as follows:
add_action( 'woocommerce_product_options_general_product_data',
'woo_add_custom_general_fields' );
function woo_add_custom_general_fields() {
global $woocommerce, $post;
echo '<div class="options_group">';
woocommerce_wp_text_input( array( // Text Field type
'id' => '_datasheet_url',
'label' => __( 'Datasheet', 'woocommerce' ),
'placeholder' => 'http://',
'desc_tip' => 'true',
'description' => __( 'Datasheet URL here.', 'woocommerce' )
) );
echo '</div>';
}
add_action( 'woocommerce_process_product_meta',
'woo_save_custom_general_fields' );
function woo_save_custom_general_fields( $post_id ){
$datasheet_field= $_POST['_datasheet_url'];
if( !empty( $datasheet_field ) )
update_post_meta( $post_id, '_datasheet_url', esc_attr( $datasheet_field
) );
}
add_action('woocommerce_product_meta_start',
'woo_display_custom_general_fields_values', 5);
function woo_display_custom_general_fields_values() {
global $product;
$url = get_post_meta( $post->ID, 'Datasheet', true );
echo '<img src="http://www.freemansolutions.co.uk/wp-content/uploads/pdf-
icon.png"> Datasheet';
}
The main error is $url = get_post_meta( $post->ID, 'Datasheet', true ); as $post is not defined, then $post->ID throw an error and you can get the URL custom field value.
Try the following instead:
add_action( 'woocommerce_product_options_general_product_data', 'add_datasheet_url_custom_field' );
function add_datasheet_url_custom_field() {
echo '<div class="options_group">';
woocommerce_wp_text_input( array(
'id' => '_datasheet_url',
'label' => __('Datasheet URL', 'woocommerce'),
'placeholder' => 'http://',
'desc_tip' => 'true',
'description' => __('Set the "Datasheet" URL here.', 'woocommerce'),
) );
echo '</div>';
}
add_action( 'woocommerce_process_product_meta', 'save_datasheet_url_custom_field', 12, 1 );
function save_datasheet_url_custom_field( $post_id ){
if( isset( $_POST['_datasheet_url'] ) )
update_post_meta( $post_id, '_datasheet_url', sanitize_text_field( $_POST['_datasheet_url'] ) );
}
add_action('woocommerce_product_meta_start', 'use_datasheet_url_custom_field', 5 );
function use_datasheet_url_custom_field() {
$pdf_url = get_post_meta( get_the_id(), '_datasheet_url', true );
if( ! empty( $pdf_url ) ){
$icon_pdf = home_url( '/wp-content/uploads/pdf-icon.png' );
echo '<img src="'.$icon_pdf.'" /> ' . __('Datasheet', 'woocommerce') . '';
}
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
I'm trying to add checkbox to settings tab in WooCommerce (in admin panel) and use this code:
add_action( 'woocommerce_product_options_general_product_data', 'wc_custom_add_custom_fields' );
function wc_custom_add_custom_fields() {
global $post;
woocommerce_wp_checkbox(array(
'id' => 'is_gift',
'label' => __('Gift', 'woocommerce' ),
'description' => __( 'Add gift label', 'woocommerce' ),
'value' => get_post_meta($post->ID, 'is_gift', true)
));
}
add_action( 'woocommerce_process_product_meta', 'wc_custom_save_custom_fields' );
function wc_custom_save_custom_fields() {
global $post;
if (!empty($_POST['is_gift'])) {
update_post_meta( $post->ID, 'is_gift', esc_attr( $_POST['is_gift'] ) );
}
}
This code showing checkbox, but not saving changes. It works only for one product. I guess something wrong with $post->ID?
Updated … Try this instead:
add_action( 'woocommerce_product_options_general_product_data', 'wc_custom_add_custom_fields' );
function wc_custom_add_custom_fields() {
global $post;
$input_checkbox = get_post_meta( $post->ID, 'is_gift', true );
if( empty( $input_checkbox ) ) $input_checkbox = '';
woocommerce_wp_checkbox(array(
'id' => 'is_gift',
'label' => __('Gift', 'woocommerce' ),
'description' => __( 'Add gift label', 'woocommerce' ),
'value' => $input_checkbox,
));
}
add_action( 'woocommerce_process_product_meta', 'wc_custom_save_custom_fields' );
function wc_custom_save_custom_fields($post_id) {
$_custom_text_option = isset( $_POST['is_gift'] ) ? 'yes' : '';
update_post_meta( $post_id, 'is_gift', $_custom_text_option );
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
try this
add_action( 'woocommerce_product_options_general_product_data', 'woo_add_custom_general_fields' );
function woo_add_custom_general_fields() {
global $woocommerce, $post;
$checkbox_value = get_post_meta( $post->ID, 'is_gift', true );
if( empty( $checkbox_value ) ){
$checkbox_value = '';
}
woocommerce_wp_checkbox(
array(
'id' => 'is_gift',
'label' => __('Gift', 'woocommerce' ),
'description' => __( 'Add gift label', 'woocommerce' ),
'value' => $checkbox_value,
)
);
}
// Save Fields
add_action( 'woocommerce_process_product_meta', 'woo_add_custom_general_fields_save' );
function woo_add_custom_general_fields_save( $post_id ){
// Checkbox
$_checkbox = $_POST['is_gift'];
if (isset( $_checkbox )){
update_post_meta( $post_id, '_is_gift', $_checkbox );
}
}
I have created custom fields in my WooCommerce checkout page billing form. It all works fine but I am trying to add an h3 element with text in between. So basically I ask for some additional information in the billing form, but I want to give that a heading.
I tried to create a h3 dynamically with Javascript/jQuery and insert before the specific id I want it to be. But this didn't work as I liked and I rather have a server-side solution.
Thanks in advance!
Here's the function where I define my custom fields. I've tried an echo at the beginning but it ends up displaying at the top of the entire form.
// Modify billing fields
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
unset($fields['billing']['billing_phone']);
unset($fields['billing']['billing_email']);
//echo '<h3>Wie is de verzender?</h3>';
$fields['billing']['name_sender'] = array(
'label' => __('Uw naam', 'woocommerce'),
'required' => true,
'class' => array('form-row-wide'),
'clear' => true
);
$fields['billing']['email_sender'] = array(
'label' => __('Uw email', 'woocommerce'),
'required' => true,
'class' => array('form-row-wide'),
'clear' => true
);
$fields['billing']['phone_sender'] = array(
'label' => __('Uw telefoonnummer', 'woocommerce'),
'required' => true,
'class' => array('form-row-wide'),
'clear' => true
);
$fields['billing']['anoniem'] = array(
'label' => __('Anoniem verzenden?', 'woocommerce'),
'type' => 'checkbox',
'class' => array('form-row-wide'),
'clear' => true
);
return $fields;
}
A visual explanation:
Visual explanation
You can hook into the woocommerce_form_field_<field_type> filter. This allows us to add HTML output for an additional field type (and in this case we can output HTML for a heading instead) and we can use this new heading "field type" when modifying checkout fields with the woocommerce_checkout_fields filter.
// Add field type to WooCommerce form field
add_filter( 'woocommerce_form_field_heading','sc_woocommerce_form_field_heading', 10, 4 );
function sc_woocommerce_form_field_heading($field, $key, $args, $value) {
$output = '<h3 class="form-row form-row-wide">'.__( $args['label'], 'woocommerce' ).'</h3>';
echo $output;
}
// Modify checkout fields
add_filter( 'woocommerce_checkout_fields','custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
$fields['billing']['billing_heading_name'] = array(
'type' => 'heading',
'label' => 'Heading here',
);
When modifying fields using the woocommerce_checkout_fields filter you can now place your new heading field in any position you need.
function filter_woocommerce_form_field_radio( $field, $key, $args, $value ) {
// Based on key
if ( $key == 'radio_choice' ) {
if ( ! empty( $args['options'] ) ) {
$field = '<div><h1>Heading</h1><ul>';
foreach ( $args['options'] as $option_key => $option_text ) {
$field .= '<li>';
$field .= '<input type="radio" value="' . esc_attr( $option_key ) . '" name="' . esc_attr( $key ) . '" id="' . esc_attr( $args['id'] ) . '_' . esc_attr( $option_key ) . '" />';
$field .= '<label>' . esc_html( $option_text ) . '</label>';
$field .= '</li>';
}
$field .= '</ul></div>';
}
}
return $field;
}
add_filter( 'woocommerce_form_field_radio', 'filter_woocommerce_form_field_radio', 10, 4 );
QUESTION UPDATED AS PEOPLE SEEMED TO MISUNDERSTAND IT:
Using the WooCommerce plugin for WordPress, I'd like to display the product variation names in the Additional Information tab in the same way as weight and dimesions are displayed.
For instance, I have a product that comes in two sizes, 2 litres and 10 litres, therefore it's a variable product with the two product variations '2 litres' and '10 litres'. If I check the box 'display on product page', size is displayed in the Additional Information tab like this: 'Size: 2 litres, 10 litres'.
I want it to work like the weight and dimensions, so when the product variation '2 litres' is selected, the Additional Information tab will display 'Size: 2 litres', and when the product variation '10 litres' is selected, the Additional Information tab will display 'Size: 10 litres'.
Can this be done?
Here is the full code to add all types of custom input fields for Product Variations:
<?php
// Add Variation Settings
add_action( 'woocommerce_product_after_variable_attributes','variation_settings_fields', 10, 3 );
// Save Variation Settings
add_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 );
/**
* Create new fields for variations
*
*/
function variation_settings_fields( $loop, $variation_data, $variation ) {
// Text Field
woocommerce_wp_text_input(
array(
'id' => '_text_field[' . $variation->ID . ']',
'label' => __( 'My Text Field', 'woocommerce' ),
'placeholder' => 'http://',
'desc_tip' => 'true',
'description' => __( 'Enter the custom value here.', 'woocommerce' ),
'value' => get_post_meta( $variation->ID, '_text_field', true )
)
);
// Number Field
woocommerce_wp_text_input(
array(
'id' => '_number_field[' . $variation->ID . ']',
'label' => __( 'My Number Field', 'woocommerce' ),
'desc_tip' => 'true',
'description' => __( 'Enter the custom number here.', 'woocommerce' ),
'value' => get_post_meta( $variation->ID, '_number_field', true ),
'custom_attributes' => array(
'step' => 'any',
'min' => '0'
)
)
);
// Textarea
woocommerce_wp_textarea_input(
array(
'id' => '_textarea[' . $variation->ID . ']',
'label' => __( 'My Textarea', 'woocommerce' ),
'placeholder' => '',
'description' => __( 'Enter the custom value here.', 'woocommerce' ),
'value' => get_post_meta( $variation->ID, '_textarea', true ),
)
);
// Select
woocommerce_wp_select(
array(
'id' => '_select[' . $variation->ID . ']',
'label' => __( 'My Select Field', 'woocommerce' ),
'description' => __( 'Choose a value.', 'woocommerce' ),
'value' => get_post_meta( $variation->ID, '_select', true ),
'options' => array(
'one' => __( 'Option 1', 'woocommerce' ),
'two' => __( 'Option 2', 'woocommerce' ),
'three' => __( 'Option 3', 'woocommerce' )
)
)
);
// Checkbox
woocommerce_wp_checkbox(
array(
'id' => '_checkbox[' . $variation->ID . ']',
'label' => __('My Checkbox Field', 'woocommerce' ),
'description' => __( 'Check me!', 'woocommerce' ),
'value' => get_post_meta( $variation->ID, '_checkbox', true ),
)
);
// Hidden field
woocommerce_wp_hidden_input(
array(
'id' => '_hidden_field[' . $variation->ID . ']',
'value' => 'hidden_value'
)
);
}
/**
* Save new fields for variations
*
*/
function save_variation_settings_fields( $post_id ) {
// Text Field
$text_field = $_POST['_text_field'][ $post_id ];
if( ! empty( $text_field ) ) {
update_post_meta( $post_id, '_text_field', esc_attr( $text_field ) );
}
// Number Field
$number_field = $_POST['_number_field'][ $post_id ];
if( ! empty( $number_field ) ) {
update_post_meta( $post_id, '_number_field', esc_attr( $number_field ) );
}
// Textarea
$textarea = $_POST['_textarea'][ $post_id ];
if( ! empty( $textarea ) ) {
update_post_meta( $post_id, '_textarea', esc_attr( $textarea ) );
}
// Select
$select = $_POST['_select'][ $post_id ];
if( ! empty( $select ) ) {
update_post_meta( $post_id, '_select', esc_attr( $select ) );
}
// Checkbox
$checkbox = isset( $_POST['_checkbox'][ $post_id ] ) ? 'yes' : 'no';
update_post_meta( $post_id, '_checkbox', $checkbox );
// Hidden field
$hidden = $_POST['_hidden_field'][ $post_id ];
if( ! empty( $hidden ) ) {
update_post_meta( $post_id, '_hidden_field', esc_attr( $hidden ) );
}
}
?>
To get those values on the frontend we just need to use the popular get_post_meta() function.
Reference article at here:
http://www.remicorson.com/woocommerce-custom-fields-for-variations/
Here's a first attempt. There's not a lot to go on in the attributes table, but when an attribute dropdown is changed, it will find the attribute in the additional information tab (where it is listed in default WooCommerce) and change the text to match the label in the dropdown. A problem occurs when the customer switches back to the empty "choose" option, so you'd need to expand this to somehow account for that.
jQuery( document ).ready(function($) {
$( ".variations_form" ).on( 'change', '.variations select', function() {
id = $(this).attr('id');
attribute = toTitleCase( $(this).attr('id').replace("pa_", "") );
selected = $(this).find('option:selected').text();
$('#tab-additional_information').find('.shop_attributes th:contains('+attribute+')').next('td').text(selected);
});
function toTitleCase(str){
return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
}
});
Save the above as somescript.js in your theme's folder. Then add the following to functions.php to properly enqueue the script.
/**
* Proper way to enqueue scripts and styles
*/
function theme_name_scripts() {
wp_enqueue_script( 'script-name', get_template_directory_uri() . '/somescript.js', array('jquery'), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );