How to add custom fields to a WooCommerce product

In this post, I’m going to walk through the entire process of adding custom fields to a WooCommerce product. Custom fields (also called product addons) include text fields, select fields, checkboxes, and so on. They allow the user to enter additional, personalised information about a product. The post will cover creating and displaying the custom fields, adding the custom field data to the cart, and inserting the data in emails and orders. Read more

How to add a custom field to a WooCommerce Subscriptions variation product

There may come a time in your life when you’re working with WooCommerce and WooCommerce Subscriptions and you realise that you need to add a custom field to a variable subscription product. Admittedly, most people will live their entire lives without encountering this need but if you’re one of the few who do, then hopefully this article will help.

We are going to add a custom text field to a variable subscription product and save it. The code below is everything you need.

<?php
/**
* Add a custom text field to a variable subscription product
* @since 1.0.0
*/
function prefix_display_fields( $loop, $variation_data, $variation ) {
$custom_field_value = get_post_meta( $variation->ID, 'my_custom_field', true );
?>
<div class="variable_subscription_pricing show_if_variable-subscription">
<p class="form-row form-row-first form-field show_if_variable-subscription _subscription_my_custom_field">
<label for="variable_subscription_my_custom_field[<?php echo esc_attr( $loop ); ?>]">
<?php
// translators: placeholder is a currency symbol / code
echo esc_html__( 'My Custom Field', 'text-domain' );
?>
</label>
<input type="text" class="wc_input_my_custom_field" name="variable_my_custom_field[<?php echo esc_attr( $loop ); ?>]" value="<?php echo esc_attr( $custom_value ); ?>" placeholder="<?php echo esc_attr_x( 'e.g. Hello', 'example text', 'text-domain' ); ?>">
</p>
</div>
<?php
}
add_action( 'woocommerce_variable_subscription_pricing', 'prefix_display_fields', 10, 3 );
/**
* Save the custom field
* @since 1.0.0
*/
function prefix_save_product_variation( $variation_id, $index ) {
if ( isset( $_POST['variable_my_custom_field'][ $index ] ) ) {
$variable_my_custom_field = sanitize_text_field( $_POST['variable_my_custom_field'][ $index ] );
update_post_meta( $variation_id, 'variable_my_custom_field', $variable_my_custom_field );
}
}
add_action( 'woocommerce_save_product_variation', 'prefix_save_product_variation', 20, 2 );

Displaying the custom field

The function prefix_display_fields will output the field. Note that the $loop parameter is used to keep track of which variation is being displayed. The function is hooked to the woocommerce_variable_subscription_pricing action.

Saving the custom field value

Having output the field, we now want to save any values entered. The prefix_save_product_variation function accomplishes this by hooking to the woocommerce_save_product_variation action. Note that the $index parameter is used here to identify which variation is being saved.

WooCommerce Name Your Price

Name Your Price plugins allow you to be flexible in how much you charge for your products – to such an extent that you let your customers choose how much they want to pay. You can set minimum and maximum price ranges, if you wish, or leave the price completely open-ended. You can even allow customers to set the price for optional extras within the product rather than for the entire product. Use Name Your Price to accept donations, build trust, or run special promotions.

Read more

How to personalize WooCommerce products with additional options

WooCommerce is a very flexible and, at times, complex ecommerce plugin for WordPress. But sometimes it doesn’t give you quite the functionality you’re looking for out of the box so you need to start looking for extensions to help you accomplish what you want to achieve. One example of this is allowing your customers to create personalized or customizable products by using a WooCommerce products addons plugin. Read more

Add WooCommerce tags to your plugin

I wasn’t aware of these two tags for WooCommerce till I noticed one of my plugins was reporting as not tested with the latest version of WooCommerce. In your main plugin file, not the readme, you can add:

 * WC requires at least: 2.5
 * WC tested up to: 3.1

These declare the minimum version of WooCommerce that your plugin requires and the latest version it’s been tested against.

More information here.